前端每周清單第9期:向重度 jQuery 開發者介紹Vue.js;React Studio 1.0.2、ECharts GL 1.0 alpha、Prettier 1.0、Meteor 1.4.4發布

因個人精力有限,暫停簡書的維護,歡迎大家關注我的知乎https://www.zhihu.com/people/wei-wei-24-86-36/activities,會持續分享前端、Web開發相關文章

前端 前端每周清單

前端每周清單專注前端領域內容,分為新聞熱點、開發教程、工程實踐、深度閱讀、開源項目、巔峰人生等欄目。關注【前端之巔】微信公眾號(ID:frontshow),及時獲取前端每周清單。

新聞熱點

國內國外,前端最新動態

  • 《Prettier 1.0 發布》:Prettier 是目前最為流行的 JavaScript 格式化工具之一,其能夠將代碼編譯為 AST 然后將格式化之后的代碼寫回到文件中。在 1.0 正式版中,Prettier 對于 JSX、CSS-in-JS、裝飾器、Flow 等語法添加了支持或者優化了格式結果,并且修復了一系列的錯誤。Prettier 可以同時在命令行、WebStorm、VSCode 等常見的編輯器中使用,筆者建議開發團隊應該統一格式化工具以避免無謂的提交。( http://jlongster.com/prettier-1.0 )

  • ECharts GL 1.0 alpha 發布:(https://parg.co/bR9)ECharts GL 是 ECharts 的 WebGL 擴展,其中提供了三維散點圖,飛線圖,柱狀圖,曲面圖,地球等多種三維可視化方式。并且增加 scatterGL,graphGL 系列類型用于二維的散點圖,關系圖的加速繪制和布局。(https://parg.co/bR9

  • 《Chrome 59 即將支持 Headless 模式》:近日,Chrome 宣布在 59 版本中開始支持 Headless/Server 模式,允許用戶加載網頁、提取出 DOM 這樣的元數據、生成網頁內容的位圖等等 Chromium 與 Blink 所支持的功能。同時,著名 Headless 瀏覽器 PhantomJS 的某位核心開發者宣布退出 PhantomJS,噫吁唏。( https://parg.co/bRi )

  • 《Meteor 1.4.4 發布》:近日 Meteor 宣布發布其 1.4.4 版本,包括了對于部分核心依賴的更新與錯誤的修復,并且提升了整體的穩定性,同時為 Cordova 應用添加了基于 Google 權限認證的功能。( https://parg.co/bRs )

  • 《React Studio 1.0.2 發布》:React Studio 是基于 React 的交互式開發工具,在其新版本中優化了界面布局,使得開發者更方便地添加組件到項目中;提供了回撤、隱藏等功能,并且加入了許多新的模板項目,允許自定義 CSS 動畫類型等功能。( https://parg.co/bRC )

開發教程

步步為營,掌握基礎技能

  • 《完整的 HTTP/2 服務端推送指南》:HTTP/2 相較于 HTTP/1 帶來了極大的性能提升,而其中的服務端推送允許服務端在客戶端請求之前主動地推送未來可能需要的靜態資源;這種方式能夠較好地在實現 HTTP/1 優化中常用的內聯方式的同時避免其帶來的實踐中的缺陷。而本文則是詳細地介紹服務端推送的原理、其解決的問題以及在常見服務器中的配置方式。( https://parg.co/bRH )

  • 《利用 React 打造特斯拉電池儀表盤》:本系列文章介紹了如何用 React、Redux 等相關前端技術來打造簡單的特斯拉電池儀表盤界面。其第一篇博客著眼于如何使用 create-react-app 創建基本項目并且使用組件內狀態來存儲數據;而第二篇博客則介紹了如何使用 Redux 來管理外部狀態。( https://parg.co/bR3 )

  • 《基于 JavaScript 構建數據表達式分詞器》:本文是一篇挺有意思的文章,介紹如何利用 JavaScript 解構常見數學表達式并且從中提取出相關實體。本文涉及到的內容包括對于分詞器的簡單介紹、對于抽象語法樹 AST 的介紹以及最終如何使用代碼來實現分詞算法。( https://parg.co/bRO )

  • 《面向重度 jQuery 開發者的 Vue.js 介紹》:本文是一位經驗豐富的開發者,在將原有的基于 jQuery 工程重構為基于 Vue.js 工程的過程中總結出的經驗與認識介紹。本文首先從零開始介紹如何搭建 Vue.js 基礎項目并且一步一步地實現應用的各種特征,同時還對比了利用 Vue.js 與 利用 jQuery 實現的差異性以及二者在設計思想上的區別。( https://parg.co/bRN )

工程實踐

立足實踐,提示實際水平

  • 《Sketch 43 會改變你的工作流》:在近日的 Sketch Meetup 中 Andree 再次確認下個版本的 Sketch 會提供新的開放式文件格式,允許開發者自定義程序來讀取或者修改文件。Andree 還提到了所謂設計即代碼、代碼即設計的理念,本文作者認為即使這種方式還是存在一定的缺陷,但是這種新的開源格式仍然會為開發者與設計者的日常工作流帶來極大的改變。( https://parg.co/b4w )

  • 《TypeScript 在 Slack 的實踐分享》:維護大型的跨平臺的 JavaScript 代碼庫是一件非常具有挑戰性的工作,無論是從 Chrome 的 JavaScript 中傳遞對象給 Objective-C 或者單純的接受來自 Node.js 中的回調結果,你都需要保證不同的代碼對于通訊對象的期望之間的一致性。而本文即是在開發跨平臺多終端的應用中,Slack 使用 TypeScript 來約束類型,從而避免意外的類型不一致導致的崩潰的實踐經驗分享。( https://parg.co/bRR )

  • 《Twitter Lite 與高性能可擴展 React PWA 實踐》:本文是 Twitter 工程師團隊介紹其在開發世界上最大的 PWA 應用之一, Twitter Lite 過程中克服各種各樣的性能瓶頸的實踐經驗。其核心思想包括基于路由的代碼切分、避免可能導致掉幀的函數、使用壓縮比更好的圖片資源、以及優化 React 更新過程、避免頻繁修正 Redux Store、延遲注冊 ServiceWorker 等部分。( https://parg.co/bRV )

  • 《React Native 性能優化》:本文作者承接 React Native 性能瓶頸與解決方案,以新的實際開發中的例子討論如何優化 React Native 應用性能。作者以類似于 Android 中 Toolbar 的列表為例,介紹了如何對性能進行測試、使用原生的滾動監聽、使用聲明式接口等多個方面的內容。( https://parg.co/bRk )

深度閱讀

深度思考,升華開發智慧

  • 《2017 里 JavaScript 帶給我的感動》:本文作者縱覽了在 2017 年中 JavaScript 生態圈可能迎來的一系列巨大變革。他首先對比了 JavaScript 與 Reason,淺述了二者的優劣對比。然后介紹了 WebAssembly 以及另一個新興語言 Rust 未來可能在 JavaScript 生態圈中占據的一席之地。最后,作者還介紹了 Docker、Now.sh 以及 Github Pages 等一系列優秀的輔助開發工具,并且暢想了去中心化浪潮下 Web 的未來發展。( https://parg.co/bRh )

  • 《算法驅動設計:人工智能是如何改變設計流程的》:大數據時代人工智能不斷滲透工作生活的方方面面,而本文作者則是從設計的角度出發,介紹了如何在實際工作中貫徹算法驅動設計的理念,利用算法模型與歷史數據來判斷什么樣的設計可能更會受到用戶的青睞;作者還以完整的設計實例介紹了從構建到素材準備的流程。( https://parg.co/bRt )

  • 《后 MVC 時代》:在很長一段時間里,MVC(Model-View-Controller)架構是構建應用的黃金法則,而近幾年隨著 React,Vue.js,Angular 等以組件為中心的庫的流行,MVC 架構在前端卻趨于平寂。開發者往往將模型、視圖與控制器耦合在單個實體內,而打破了傳統的 MVC 架構中的約束。類似于 Flux 或者響應式編程的設計思想也改變了應用狀態的處理方式,不同于 MVC 中的雙向綁定,而是數據在實體之間單向流動。本文即是討論在所謂后 MVC 時代的 GUI 應用架構的思考。( https://realm.io/news/the-post-mvc-age/ )

  • 《瀏覽器中的原生 ES6 模塊:是時候重新考慮打包發布流程?》:ES6 模塊標準出臺已有數年,而目前最流行的方式就是使用 Babel 等轉譯工具將 ES6 模塊轉譯為 CommonJS 等模塊語法以發布到瀏覽器中運行。而隨著 Safari、Firefox、Edge 都紛紛支持原生 ES6 模塊,本文作者也重新思考是否需要改變現有的應用打包與發布流程。本文首先對比介紹了基于 Babel/Webpack 的打包與使用原生的 ES6 模塊之間的異同,討論了真實環境下直接使用原生模塊的可行性等內容。( https://parg.co/bRL )

開源項目

樂于分享,共推前端發展

  • 《Electron Forge》:Electron Forge 是構建現代 Electron 應用的完整工具集,其整合了很多現存的用于 Electron 的開發工具,去蕪存菁,將它們整合為簡單易用的能夠直接上手的輔助開發工具。( https://parg.co/bRf )

  • 《Elasticlunr.js》:Elasticlunr.js 是輕量級的提供了瀏覽器端搜索與離線搜索的全文搜索引擎,其基于 Lunr.js 開發不過提供了更加靈活的功能。Elasticlunr.js 支持基于時間與指定域的查詢,它有點類似于 Solr 不過更為靈活并且對于開發者更為友好。( http://elasticlunr.com/ )

  • 《CodeSandbox》:CodeSandbox 是一個在線的 React 編輯器,其能夠幫助開發者更快更方便地展示與分享基于 React 的項目。CodeSandbox 會自動化執行類似于編譯、打包、依賴管理等多種項目構建中的常見任務,同時 CodeSandbox 還允許開發者添加自定義的 node_modules 中的依賴。( https://parg.co/bR8 )

  • 《Slate》:Slate 是類似于 Draft.js 的靈活可自定義的富文本編輯器構建框架,Slate 允許你構建功能豐富的類似于 Medium、Dropbox Paper、Canvas 這樣的編輯器。Slate 提供了各式各樣的插件,你可以基于 React 與 Immutable 來構建自定義的插件,并且指定哪些插件屬于核心插件。( https://docs.slatejs.org/ )

巔峰人生

《鏈家鳥哥:從留級打架問題學生到PHP大神,他的人生驅動力竟然是》:從問題勸退學生到高考725分學霸,陰差陽錯選擇計算機;也曾北漂住過地下室,也曾面試被拒;不斷走出舒適區,快速成長……一個小視屏,帶你走進鳥哥的攀登巔峰之路。(https://parg.co/bRy

前端之巔

「前端之巔」是InfoQ旗下關注前端技術的垂直社群,加入前端之巔學習群請關注「前端之巔」公眾號后回復“加群”。投稿請發郵件到editors@cn.infoq.com,注明“前端之巔投稿”。

前端之巔微信底圖-5.jpg
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,578評論 6 544
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,701評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,691評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,974評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,694評論 6 413
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,026評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,015評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,193評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,719評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,442評論 3 360
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,668評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,151評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,846評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,255評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,592評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,394評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,635評論 2 380

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,768評論 25 708
  • 片段2《刻意練習》——即時反饋 傳道,授業,解惑,老師和教練最大的用處是什么?也許對一般人來說小學老師最大的作用是...
    栗子小咪閱讀 120評論 1 1
  • 隱藏NavigationBar時的一個坑(很實用)自定義iOS7導航欄背景,標題和返回按鈕文字顏色iOS手勢返回的...
    Barry_小閃閱讀 534評論 0 0
  • 偶然看見一則小故事,愿與你分享。漢代有一人名喚張敞,他小時候很頑皮,不小心用石塊擲傷同村的一個女子的眉,張敞惶惶然...
    高冷男孩會逗比閱讀 282評論 2 2