前端資訊周報 3.20 - 3.26: 使用Node開發桌面應用入門,以及如何極限壓縮css
每周一我都會分享上一周我訂閱的技術站點中,和解決問題的過程中閱讀到的值得分享的文章。
畢竟個人的閱讀量有限,也歡迎大家留言或者私信給我你們閱讀到的,對你們前端技術有幫助的任何內容,題材不限,語言不限。可以是技術博客,也可以是知乎或stackoverflow的問答。
如果你覺得這篇分享給你帶來了幫助,請不要吝惜的點個贊,或者把這個專欄推薦給你的朋友們,還可以關注我。謝謝啦!
本周推薦
Beyond The Browser: From Web Apps To Desktop Apps
如果你對Node.js新聞有所關注的話,你也許曾經聽說過 node-webkit (現已改名為NW.js),一個用於開發桌面應用的Node分支。這篇文章在對比 NW.js 與 Electron 這兩個基於 Node 的桌面應用框架的基礎上,詳細講解了使用Node開發桌面應用中的一些坑和要注意的地方。總之這是一篇引領你入門開發Node應用的好文章
CSSnRemynification: A completely crazy idea that worked
如何把css文件壓縮到最小呢,就是把壓縮後的結果再次壓縮、再次壓縮、再次壓縮……並且使用不同的壓縮工具(csso,ncrass等)組合壓縮知道得到最優的結果。於是在作者的一個實驗中,花費了25分鐘壓縮減少了261 bytes大小。挺有意思的一篇文章
Announcing Guetzli: A New Open Source JPEG Encoder
上周漏掉了一個新聞:Google開源了它的JPG壓縮優化演算法 Guetzli. 這個項目在github上可以找到: google/guetzli 。我個人的測試結果是,在壓縮的最好效果下,文件大小會減少48%。不過非常慢,至少需要5秒左右。這個結果實在nquality 參數為默認最小值84的情況下算出的。默認版本不允許參數更小,否則就會看到人工修改的痕迹了
10 Best Practices for Writing Node.js REST APIs
如何設計出好的Node.js API?這篇文章給了我很多啟發,尤其是 Conditional Requests 這一原則是我之前沒有了解過的。之前有通過header做一些緩存,但是系統的分層次的緩存還是第一次了解到。有機會做一個專題
Which Responsive Design Framework Is Best? Of Course,nIt Depends.
這篇文章從幾個簡單的方面對比了兩個響應式框架 Bootstrap 和 Foundation。其實更有意思的是文章下方的評論。說到底他們在討論一個問題,我們是否應該使用前端CSS框架?或者如何使用?放著框架不用,我們是不是一直在重新發明輪子?如果一直在使用框架,是否又有些本末倒置了?
新手教程
Writing HTML with accessibility in mind
Writing JavaScript with Accessibility in Mind
估計在國內很少有前端開發人員會關注accessibility這個問題。accessibility不僅意味給閱讀障礙人士提供便利,對普通人來說也方便我們使用鍵盤來訪問頁面上的元素。這兩篇文章就分別從HTML和Javascript角度來講解如何在開發中注意這些問題。同時你也會真正學會如何使用那些最熟悉的陌生屬性`role`,`tabIndex`等的用法
Getting Started with Brunch: The Ultra-FastnSimple-Config Build Tool
你一定知道webpack,這篇文章就是在介紹另一個類似於webpack的打包工具Brunch。這個工具目前在github上有5k個stars。不過我還是蠻煩造(或者說是重新發明)輪子的。大家可以玩一玩吧。最近我在寫一個webpack速成,敬請期待
Creating a Book Cover Using JavaScript and p5.js
這是一篇 p5.js 的入門文章。p5.js 是一款在網頁中(藉助canvas)繪製圖形和動畫的類庫。借這篇談 p5.js 的文章推薦一本書:《Thennature of code》這是一本開源圖書,你可以線上閱讀,談論的是如何使用代碼實現現實中的物理效果。如果你對物理碰撞感興趣或者遊戲編程感興趣,則千萬別錯過這本書。同時p5.js 是這本書代碼示例中使用的類庫
A Glimpse Into The Future With React Native For Web
你肯定使用過 React, 或者你還聽說過 React Native,但你不一定聽說過 React Native for web. React Native fornWeb就是用 React Native 的開發方式開發能運行在瀏覽器中的Web應用。具體怎麼做呢,請參考這篇文章。(順便提一句,我聽說 ReactnNative的效果其實並不好,常常崩潰,也不如原生應用。有使用過的朋友嗎?這些是傳言還是真的?)
Five CSS Performance Tools to Speed up Your Website
5個用於檢測網站CSS性能的工具,還是有點用的,比如檢測無用的樣式,效率低的樣式等等。不過估計你也不會看,看了也不一定會用這些工具,屬於典型的喜加一系列文章
講講道理
The bricks we lay
在美國反特朗普的潮流下。文章的作者從設計的角度上表達了他的觀點:設計並非是中立的。它是多種綜合體(你的觀點、技巧、天賦)的結果。同時產出的設計也會帶來其他的一系列後果而影響到其他人,甚至造成傷害。所以有時候我們不應該只關注於手裡的工作,而是應該問問自己我的這些產出會帶來哪些負面的影響,以及如何儘可能少的減少這些影響
Need to Catch Up on the AMP Debate?
這又是一篇談 AMP 爭議的文章。這篇文章比較中立客觀,首先簡單的完整介紹了AMP,其次涵蓋了各方的觀點,最後也表達了自己的立場。大夥的留言也是看點。就我個人而言是不太喜歡AMP這種東西的,雖然百度現在也在做相似的產品
其他
A Little Surprise Is Waiting For You Here — Meet ThenNext Smashing Magazine
SmashingnMagazine 是我經常瀏覽的一個網站,也是我獲取前端知識的一個重要來源。它即將改版,這篇文章里詳細描述了它在改版之中所使用到的一些服務以及用到的技術,這讓我大開眼界。不是說這些技術有多麼先進,而是作為一個新聞類網站能這麼有技術情操真是感動
推薦閱讀:
※如何學慣用Typescript寫Reactjs?
※前端資訊周報 4.10 - 4.16: 本周沒有大新聞
※兩道前端的面試題,求各位大神解答一下?
※從零學習前端開發·HTML