因個人精力有限疮鲫,暫停簡書的維護吆你,歡迎大家關注我的知乎https://www.zhihu.com/people/wei-wei-24-86-36/activities,會持續(xù)分享前端俊犯、Web開發(fā)相關文章
周報封面4.jpg
作者 | 王下邀月熊
編輯 | 尾尾
新聞熱點
國內(nèi)國外妇多,前端最新動態(tài)
- 《蘋果「熱修復門」事件復盤、分析和展望》:近日瘫析,部分使用 Rollout.js 或者 JSPatch 的開發(fā)者表示其應用在提交審核時受到了警告砌梆,表示因為應用可能會在運行時改變其功能特征而被打回。與此同時 React Native贬循、Weex 等混合開發(fā)技術人員也表示了擔心咸包。一時間眾說紛紜,有說是針對熱修復的杖虾,有說是RN也收到警告郵件的烂瘫,恰逢微軟發(fā)布Visual Studio 2017,推出了開發(fā)React Native for iOS功能奇适,還有說蘋果借此來反制微軟的坟比。到底事情真相如何,目前都有哪些動向嚷往,會帶來什么影響葛账,此文進行了全面盤點。
- 《Let's Encrypt 升至 SSL 證書提供商首位》:隨著 HTTPS 浪潮的來臨皮仁,越來越多的金融站點籍琳、在線存儲以及其他網(wǎng)站使用 SSL 來加密傳輸數(shù)據(jù)。而作為開源免費的 SSL 證書提供商贷祈,Let's Encrypt 超越 COMODO CA Limited趋急、GeoTrust Inc.、GoDaddy 成為了占據(jù)市場份額最多的廠商势誊。
- 《Firefox 52 版本發(fā)布》:本周 Mozilla Firefox 團隊正式發(fā)布 Firefox 52 版本呜达,自此 Firefox 成為第一個默認支持 WebAssembly 的瀏覽器。同時 Firefox 還優(yōu)化了安全機制粟耻,當用戶在非安全頁面輸入密碼時會進行安全提示查近。此外本版本還引入了 CSS Grid、async/await 支持等特性挤忙。
- 《React Native 中的 FlatList 組件》:3 月 1 日開始 ReactNative 中的 FlatList 正式從測試包中移動至正式包中嗦嗡;我們在項目開發(fā)中可以使用 FlatList、SectionList饭玲、VirtualizedList 來替代傳統(tǒng)的即將被移除的 ListView侥祭。
- 《React Router 4.0 正式版發(fā)布》:今日 React Training 宣布 React Router 4.0 正式版發(fā)布,該版本相較于前面三個版本有根本性變化茄厘,遵循 Just Component 的 API 設計理念矮冬。
開發(fā)教程
步步為營,掌握基礎技能
- 《Vue.js 實用技巧》:本文來自于餓了么大前端的 cinwell次哈, Vue.js 2.0 已經(jīng)發(fā)布了有一段時間胎署,生態(tài)鏈也日漸完善。作者在使用 Vue.js 開發(fā)項目時收集的一些工具和使用技巧窑滞,分享給各位琼牧。
- 《GraphQL 名詞 101:解析 GraphQL 的查詢語法》:GraphQL 日漸成為數(shù)據(jù)查詢的主流標準之一恢筝,整個生態(tài)圈也蓬勃發(fā)展。本文則由淺入深地詳細介紹基礎的 GraphQL 格式與關鍵字巨坊,有助于初學者對于 GraphQL 的使用形成體系認知撬槽。
- 《結合 Firebase 構建完整 Angular 認證系統(tǒng)》:該作者在視頻中詳細介紹了如何利用 Angular 2 構建前端界面,并且使用 Firebase 作為后端存儲支撐來構建完整的認證系統(tǒng)趾撵。
- 《循序漸進在 Sketch 中創(chuàng)建完整的 APP 設計項目》:本文作者介紹了如何在 Sketch 創(chuàng)建完整的應用設計系統(tǒng)侄柔,從最簡單的創(chuàng)建文件夾開始,到顏色選擇占调、排版設置暂题、網(wǎng)格配置到最后的頁面到發(fā)布等等。
- 《使用 Service Worker 與 Background Sync 進行延遲請求》:本文作者以信息發(fā)送為例究珊,介紹了如何利用 Service Worker 與 Background Sync 來當用戶離線時保留用戶請求信息薪者,直到用戶重新在線時自動完成請求,將信息發(fā)送出去剿涮。
- 《Service Worker 測試》:本文介紹了一些用于測試 Service Worker 的實踐技巧與方法啸胧,來保證你的站點在離線時也能有正確地響應與操作。
- 《Angular 應用中的狀態(tài)管理》:本系列文章介紹了如何利用 ngrx/store 與 ngrx/effects 對典型的 Angular Todo 應用進行狀態(tài)管理幔虏。
工程實踐
立足實踐纺念,提示實際水平
- 《vue2-elm》:基于 vue2 + vuex 構建一個具有 45 個頁面的大型單頁面應用,涉及注冊想括、登陸陷谱、商品展示、購物車瑟蜈、下單等等烟逊,是一個完整的流程。挺不錯的學習參考資料铺根。
- 《ReactNative 性能優(yōu)化實踐》:日前有人表示 React Native 在 Android 上表現(xiàn)不佳宪躯,本文則是作者對于潛在的性能問題提出的優(yōu)化方案。作者首先分析了常見的 Overdraw 問題以及可能的問題源與解決方案位迂,然后介紹了列表中常見的 GPU 渲染瓶頸以及解決方案访雪。
- 《JavaScript 圖片處理庫盤點》:圖片處理一直是客戶端開發(fā)中的常見問題,本文則是對基于 JavaScript 的常見的進行圖片濾鏡掂林、裁剪等操作的庫進行了盤點臣缀;本文橫向比較了 CamanJS、glfx.js泻帮、grafi.js精置、Jimp 以及 Filtr2 這幾個常用的圖片處理庫,并且給出了不同業(yè)務場景下的選用建議锣杂。
- 《Slack 是如何減少其客戶端內(nèi)存占用的》:本文是 Slack 在其桌面應用的開發(fā)過程中探索出的如何減少應用內(nèi)存開銷的經(jīng)驗介紹脂倦。Slack 最初為用戶的每個登錄團隊都啟動了相同的處理進程番宁,而后根據(jù)調(diào)研發(fā)現(xiàn)僅有部分用戶會同時使用多個團隊;因此 Slack 從卸載后臺團隊的 DOM 樹赖阻、分拆 JavaScript 代碼進行優(yōu)雅降級蝶押、重構 JavaScript 代碼庫等多個方式來優(yōu)化桌面應用的內(nèi)存占用。
- 《別被現(xiàn)在的密碼設置原則騙了》:最近 CIA 的黑客工具箱曝光于眾政供,也引發(fā)了大家對于系統(tǒng)安全的擔憂播聪;本文作者則是從應用系統(tǒng)權限認證中密碼設置原則的角度出發(fā)朽基,首先指出現(xiàn)存的很多所謂密碼原則(譬如必須是 8~32 個字符布隔、必須包含字母數(shù)字等)還是存在一些漏洞,并不能完全依賴于這些原則稼虎,最后也提出了自己對于現(xiàn)在云計算與 GPU 運算的環(huán)境下如何構建有效地密碼設置體系進行了介紹衅檀。
- 《React 中 setState 的函數(shù)式用法》:React 生態(tài)圈中一直崇尚所謂函數(shù)式編程理念,而本文作者介紹了如何利用 setState 函數(shù)的回調(diào)來實現(xiàn) setState 的函數(shù)式用法霎俩;就像 Redux 中的 reducer 一樣哀军,能夠獨立聲明于組件外,然后聲明式的使用打却,從而保證組件更新邏輯的清晰與可測試性杉适。
深度閱讀
深度思考,升華開發(fā)智慧
- 《我理解的“大前端”或“大無線”》:本文主要是介紹作者所在團隊最近的一些變化和思考柳击,包括前言猿推、NodeJS職能變化、ReactNative的大規(guī)模應用捌肴、專門的架構組職能蹬叭、總結五部分。
- 《Base64 編碼與性能得失》:在 HTTP 1.x 的時代状知,為了減少網(wǎng)絡請求數(shù)秽五,我們會將小圖片以 Base64 編碼的方式插入到網(wǎng)頁中直接返回。本文則是對于 Base64 編碼的基本原理饥悴、編碼之后帶來的包體增加與解析時間損耗坦喘、使用 preload 替代 Base64 等知識進行了分析。
- 《ReactRouter-V4 構建之道與源碼分析》:本文介紹了 React Router V4 的設計思想西设,一步一步由淺入深地介紹如何從零開始構建一個類似于 React Router V4 這樣的秉持路由即組件的思想的路由框架起宽。
- 《大型可擴展系統(tǒng)的設計之道》:本文深入淺出地介紹了大型可擴展系統(tǒng)的基本組成,我們從客戶端發(fā)起的請求會在后端經(jīng)過怎樣的奇幻漂流之后形成響應數(shù)據(jù)济榨,是個前端開發(fā)者不錯的拓寬視野的閱讀資料坯沪。
- 《流行網(wǎng)站上陳舊的 JavaScript 庫留存調(diào)研》:本文是 Tobias Laudinger 及其合作者對于客戶端 JavaScript 庫的使用現(xiàn)狀的調(diào)研報告;基于對于超過 133K 個網(wǎng)站的調(diào)查結果擒滑,它們發(fā)現(xiàn)大約 37% 的站點仍然使用了某些存在已知漏洞的 JavaScript 客戶端腳本腐晾,它們建議我們一定要慎重思量網(wǎng)站中引入的外部依賴叉弦,特別是對于那些已經(jīng)運行了很久的站點。
- 《來自 Formidable 的 2017 React Naive 技術椩逄牵》:本文是來自 Formidable 的工程師 Jani Ev?kallio 介紹的他們在 2017 選定的 React Native 開發(fā)技術棧淹冰,包括構建工具、組件庫巨柒、狀態(tài)管理等等方面樱拴。
開源項目
樂于分享,共推前端發(fā)展
- 《基于 Vue2 與 Element-UI》的管理系統(tǒng)模板:基于Vue.js 2.x系列 + Element UI 的后臺管理系統(tǒng)解決方案洋满。
- 《PWA Builder》:隨著 PWA 的日漸發(fā)展晶乔,Manifoldjs 也轉(zhuǎn)型成為 PWA 應用在線構建工具;該工具為用戶提供了在線構建 Manifest牺勾、自動生成多格式 Icon正罢、創(chuàng)建 Service Worker、發(fā)布 PWA 等多種服務驻民。
- 《UnCSS》:UnCSS 能夠幫助你從樣式表中移除 HTML 中未被用到的樣式翻具,它支持多文件以及 JavaScript 樣式定義,并且提供了接口回还、命令行裆泳、構建插件、POSTCSS 插件等多種使用方式柠硕。
- 《命令行圖片壓縮工具探討》:本文對于基于 ImageMagic 進行常見的圖片工禾、壓縮轉(zhuǎn)換任務進行了介紹。
- 《Vue.js 前端框架比較》:本文是對常用的基于 Vue.js 的前端框架的比較仅叫。
巔峰人生
一覽眾山帜篇,聆聽巔峰故事
《創(chuàng)業(yè)公司的CTO不是人干的》:清華到360,再到創(chuàng)業(yè)公司CTO诫咱,熊貓CTO黃歡直播喊麥的背后笙隙,默默總結出了切身感悟:勇敢承認自己差,但可以不服輸坎缭;越容易學到的東西竟痰,含金量也越低;牛人背后掏呼,都有苦逼積累期坏快。