因個人精力有限灰瞻,暫停簡書的維護腥例,歡迎大家關注我的知乎https://www.zhihu.com/people/wei-wei-24-86-36/activities,會持續(xù)分享前端酝润、Web開發(fā)相關文章
前端每周清單專注前端領域內容燎竖,分為新聞熱點、開發(fā)教程要销、工程實踐构回、深度閱讀、開源項目疏咐、巔峰人生等欄目纤掸。關注【前端之巔】微信公眾號(ID:frontshow),及時獲取前端之巔優(yōu)質文章浑塞。
新聞熱點
國內國外借跪,前端最新動態(tài)
《Angular 4.0.0 發(fā)布》:今日 Angular 團隊宣布發(fā)布 4.0.0 版本,該版本能夠向后兼容絕大部分 2.x.x 應用酌壕。在 4.0.0 中掏愁,帶來的主要改變包括應用更小并且速度更快、更新了視圖引擎仅孩,減少了將近 60% 的生成代碼托猩、并且引入了動畫庫作為預置的核心庫的一部分等 印蓖。
《Egg.js 1.0.0 正式發(fā)布》:Egg.js 是企業(yè)級 Node.js 框架沉淀自阿里各行各業(yè)不同領域最佳實踐的插件辽慕,涵蓋了常見的業(yè)務開發(fā)場景,穩(wěn)定支撐了 15 和 16 年天貓雙 11 大促赦肃,頂級流量壓力 溅蛉。其秉持漸進式理念公浪,極具伸縮性,既適合個人小項目快速開發(fā)船侧,也適合企業(yè)級的團隊開發(fā)協(xié)作欠气。
《WebStorm 2017.1 增加對 Vue.js 的支持》:近日,JetBrains 發(fā)布了其最受歡迎的 WebStorm IDE 的 2017.1 版本镜撩,毫不例外地增加了對 Vue.js 的支持预柒。WebStorm 現(xiàn)在會識別 .vue 文件并在模板中增加代碼補全功能。當引用其他視圖組件時袁梗,WebStorm 也將能夠自動補全代碼并自動增加 import 聲明宜鸯。
開發(fā)教程
步步為營,掌握基礎技能
《Angular 4 學習資源》:隨著 Angular 4 的正式發(fā)布遮怜,本文收集了部分學習 Angular 4 的資源淋袖,包括特性總結、服務端渲染锯梁、響應式編程即碗、樣式指南等等多個部分。
《CSS Grid 典型案例》:該網(wǎng)站提供了一系列基于 React 編寫的 CSS Grid 布局的測試樣例陌凳,是個不錯的從實例中學習 CSS Grid 語法與使用的教程剥懒。
《Webpack 實踐教程》:本系列教程著眼于介紹真實應用中 Webpack 的使用,包含了三個部分:構建基礎前端項目與添加編譯支持合敦、減少包體體積與緩存蕊肥、加速構建與提升開發(fā)工作流。
《面向“遠古” Web 開發(fā)者的現(xiàn)代 JavaScript 教程》:本文主要是面向那些從 PHP蛤肌、JSP壁却、Rails 占據(jù)統(tǒng)治地位時開始進行 Web 技術的開發(fā)者進行常見的現(xiàn)代 JavaScript 基礎概念的介紹。
《你應該知道的關于 Node.js 中模塊導入的知識》:在 Node.js 開發(fā)中我們時刻都在于其模塊機制打交道裸准,而本文作者則深入淺出地介紹了 Node.js 中負責處理模塊依賴的兩個核心模塊:require 與 module展东;并且介紹了不同的導入對象在 Node.js 中實際的遞歸處理流程以及最終在 module 中形成的元數(shù)據(jù)描述。
工程實踐
立足實踐炒俱,提示實際水平
《Dropbox:使用同域 Cookie 避免跨站攻擊》:跨站請求偽造(CSRF)是常見的網(wǎng)絡滲透攻擊手段之一盐肃,攻擊者會誤導用戶在攻擊站點上對目標站點發(fā)起非法請求。本文是 Dropbox 工程師分享他們在實踐中常用的防御經(jīng)驗分享权悟,包括使用動態(tài)表單令牌砸王、同域 Cookie 等等。
《跨瀏覽器插件模板》:隨著 Firefox 也開始支持 WebExtensions峦阁,我們可以更加方便地編寫跨瀏覽器插件谦铃,盡可能地復用代碼。本倉庫則提供了基礎的插件模板榔昔,實現(xiàn)了一次編寫驹闰,多處運行瘪菌、熱加載等多個便捷功能的預置。
《VS Code 使用貼士與技巧》: VSCode 是非常輕量易用的軟件開發(fā)工具嘹朗,其豐富的插件系統(tǒng)能夠極大地滿足開發(fā)需求师妙。本文則是作者總結的一系列 VS Code 使用技巧的總結與介紹,譬如常用命令操作屹培、文件管理默穴、Git 集成、調試與任務運行等等褪秀。
《解密 JavaScript 異步編程》:JavaScript 中異步編程歷經(jīng)了多個大的迭代壁顶,從回調到 Promise 到生成器以及現(xiàn)在的 Async/Await;本文作者則是高屋建瓴地介紹了 JavaScript 異步編程的變遷歷史以及簡要的內部實現(xiàn)原理溜歪。
《Webpack CommonsChunkPlugin 與多入口公共代碼提取》:在構建基于 Webpack 的前端工作流時若专,CommonsChunkPlugin 是常用的公共代碼提取插件。而本文則是 Webpack 開發(fā)團隊對于社區(qū)反饋的CommonsChunkPlugin 使用過程中的一些誤區(qū)與同步/異步公共代碼塊提取的實踐進行總結與分析蝴猪。
《構建可維護的大型 Angular 2 應用》:本文是來自 Versett 的工程師介紹其團隊在基于 Angular 2 構建大型應用時的實踐與總結调衰。
《開發(fā) React Native 與 Redux 應用一年來的錯誤總結》:本文作者總結了他在過去一年中 React Native 與 Redux 開發(fā)中遇到的錯誤的復盤與總結,譬如布局文件分割自阱、Redux Store 設計嚎莉、項目目錄結構、表單驗證等多個方面沛豌。
深度閱讀
深度思考趋箩,升華開發(fā)智慧
《淺析 WebAssembly 緣何優(yōu)于 Asm.js》:WebAssembly 是新的 Web 中可執(zhí)行格式,逐現(xiàn)代瀏覽器紛紛地提供了對于 WebAssembly 的原生支持加派;本文則是對于 WebAssembly 相較于 asm.js 帶來的性能提升背后的原理進行簡要介紹叫确。
《ES7 Async/Await 常見誤區(qū)》:ECMAScript 6 引入的 Promise 大大簡化了 JavaScript 中異步編程語法,而 ES7 引入的 Async 則使其更為優(yōu)雅芍锦;本文作者對于實踐中常見的對于 Async/Await 的語法誤用案例進行了解析竹勉。
《React Conf 2017 盤點》:本文作者對于近日舉辦的 React Conf 2017 中的精彩演講進行了盤點,包括 Redux 與 MobX 在狀態(tài)管理領域的對比娄琉、ReactVR 等一系列優(yōu)秀的基于 React 的擴展項目次乓、代碼格式化與樣式組件、服務端渲染等等孽水。
《百度 SSP 單頁式應用性能優(yōu)化實踐》:針對首頁和部分頁面打開速度慢的問題票腰,百度SSP前端團隊對單頁式應用性能進行了優(yōu)化。本文介紹其中一個方案:基于 HTTP Chunk 的首屏數(shù)據(jù)漸進式預加載方案女气,該方案總體減少了單頁應用 1.2s 的首屏呈現(xiàn)時間杏慰。同時對比其與同構渲染方案的異同。
《Composing Software》:本系列文章由 Eric Elliott 大神發(fā)布,著眼于介紹 JavaScript 函數(shù)式編程與大型軟件項目中的可組織性技術的介紹逃默,包括了函數(shù)式編程導論、高階函數(shù)簇搅、Reduce完域、Functors & Categories 等幾個部分,還在持續(xù)更新中瘩将。
《Redux 實踐大討論》:此篇是 Markerikson 在 Redux Issue 中發(fā)起的討論吟税,主要涉及 Redux 模板冗余、過度抽象姿现、學習曲線過于曲折肠仪、太多的 Opinioned 最佳實踐等問題。
開源項目
樂于分享备典,共推前端發(fā)展
《react-native-interactable》:react-native-interactable 是由 wix 發(fā)布的用于創(chuàng)建高性能用戶交互效果的聲明式接口异旧。典型的用戶場景包括滑動式卡片、抽屜菜單提佣、伸縮式應用頭吮蛹、聊天頭等。
《awesome-github-vue》:awesome-github-vue 是由 OpenDigg 整理并維護的 Vue 相關開源項目庫集合拌屏。
《react-overdrive》:非常簡單易用的 React 應用轉場動畫實現(xiàn)庫潮针,能夠在不同的頁面間指定相同 ID 的元素,Overdrive 會自動為這兩個元素之間添加轉場動畫倚喂。
《Eagle.js》:Eagle.js 是基于 Vue.js 構建的創(chuàng)建 Web 中幻燈片的庫每篷,支持動畫、主題端圈、交互插件等常用功能焦读。
《react-perimeter》:react-perimeter 能夠為目標元素創(chuàng)建隱藏的柵欄,當用戶的鼠標移動到目標元素的指定范圍內時會觸發(fā)預設時間舱权,譬如可以執(zhí)行組件預加載等操作吨灭。
巔峰人生
- 《六問CTO,程序員的個人刑巧、職業(yè)成長如何抉擇喧兄?》:本文是聲網(wǎng) Agora.io CTO 陶思明對于程序員的自我成長、KPI 考核機制啊楚、技術管理與創(chuàng)業(yè)選擇等相關問題進行的回答與分享吠冤。
前端之巔
「前端之巔」是InfoQ旗下關注前端技術的垂直社群,加入前端之巔學習群請關注「前端之巔」公眾號后回復“加群”恭理。投稿請發(fā)郵件到editors@cn.infoq.com拯辙,注明“前端之巔投稿”。