前端小報(bào) - 201902 月刊

HitenDev 發(fā)布于2019-08-02 14:25 / 1621人閱讀

摘要：也可以安裝瀏覽器插件或，在某個(gè)文件的網(wǎng)頁上就能看到一個(gè)的按鈕，點(diǎn)擊即可。

【AIS-TXD前端技術(shù)月刊】- 本月熱門前端技術(shù)快報(bào)，匯聚 Github Trending 流行 Repo 和熱門文章，文末有福利

歡迎?訂閱?&?投稿本期小編：damujiangr (墨止)??

新聞快報(bào)

React v16.8 發(fā)布:?The One With Hooks

Hooks 上手介紹?

額外：React 終于開始做國(guó)際化了，以后國(guó)內(nèi)的新手們就能看到中文文檔的 React 了，目前正在招募 Contributors，有興趣的可以參看?Is React Translated Yet? ?Sí! Sim! はい?

Vue v2.6 發(fā)布: 代號(hào)：Macross

準(zhǔn)備與 v3.0 版本接軌了

Slot 引入了新的模版語法， v-slot (默認(rèn)插槽) v-slot:name (具名插槽)

異步錯(cuò)誤處理、編譯警告位置信息等等

專欄鏈接?

Flutter 1.2 發(fā)布

Flutter 1.2 是自第一個(gè)測(cè)試版本，歷時(shí)一年后，發(fā)布的第一次 feature update

除了提升了核心框架的穩(wěn)定性、性能和質(zhì)量，完善現(xiàn)在的widget，重要的是為開發(fā)者提供了基于 Web 的開發(fā)工具，以后還可能會(huì)直接構(gòu)建到VS Code中

widget inspector 支持樹狀層級(jí)結(jié)構(gòu)的可視化

timeline view 支持幀級(jí)別的診斷，發(fā)現(xiàn)渲染和計(jì)算的問題

full source-level debugger 支持設(shè)置斷點(diǎn)、單步執(zhí)行，查看調(diào)用堆棧

logging view 能夠顯示 app 中的日志、網(wǎng)絡(luò)、框架和垃圾回收事件

官方介紹鏈接?

支付寶小程序向個(gè)人開發(fā)者開放公測(cè)

小程序這場(chǎng)圍繞流量、場(chǎng)景、創(chuàng)意等諸多概念的新風(fēng)口，每一家公司都想要分得一杯羹，越來越多的小程序、輕應(yīng)用涌現(xiàn)出來，支付寶小程序開發(fā)公測(cè)，說明技術(shù)架構(gòu)上已趨穩(wěn)定

支付包小程序入駐鏈接?

這里還有一篇技術(shù)稿，為支付寶小程序首席架構(gòu)師白招拒，解讀支付寶小程序的技術(shù)架構(gòu)和開發(fā)特點(diǎn)，《獨(dú)家！支付寶首次披露其小程序技術(shù)架構(gòu)》?

阿里云 ARMS 推出小程序監(jiān)控

基礎(chǔ)服務(wù)的角色來了，可以用于及時(shí)發(fā)現(xiàn)卡頓、緩慢和一些錯(cuò)誤，讓小程序不再裸奔

目前支持情況：釘釘E應(yīng)用、支付寶小程序、微信小程序、其他符合標(biāo)準(zhǔn)的小程序

前端監(jiān)控接入概述?

Next.js 8 新增支持 Serverless

支持 Serverless 可以極大的提高應(yīng)用開發(fā)的可靠性和可伸縮性，啟用也很簡(jiǎn)單，查看官方詳細(xì)介紹?

// next.config.js
module.exports = {
  target: "serverless",
};

Ant Design of Vue

近日有開發(fā)者基于 Ant Design 的設(shè)計(jì)語言，開發(fā)了一套基于 Vue 組件庫，喜歡 antd 風(fēng) 的 Vue 開發(fā)者有福利了

使用體驗(yàn)方面，跟 Ant Design 官網(wǎng)的更新要滯后一些，感官上還是很不錯(cuò)的

TSLint in 2019?

隨著TypeScript生態(tài)的不斷壯大，TSLint也在不斷演進(jìn)，準(zhǔn)備提供更多的能力，更加擁抱社區(qū)共同發(fā)展，和對(duì) ESLint 的兼容，讓開發(fā)者可以無縫切換

npm 推出企業(yè)版?npm Enterprise

主打安全性，提供額外的控制權(quán)限，還可以定制CI/CD系統(tǒng)集成流程，可以理解為企業(yè)私服，比如阿里內(nèi)部的tnpm與開放的鏡像的cnpm

Github Trending

好用的代碼片段查看工具推薦者：x-cold?

將某一個(gè)文件的倉庫地址的?github.com?替換為?github.githistory.xyz?，回車即可訪問到代碼變更的記錄。也可以安裝瀏覽器插件?Chrome?或?Firefox，在某個(gè)文件的網(wǎng)頁上就能看到一個(gè) Open in Git History?的按鈕，點(diǎn)擊即可。

對(duì)于本地倉庫，可以使用命令訪問?npx git-file-history path/to/file.ext?

Github 倉庫：pomber/git-history?

? ??? ????

讓網(wǎng)站變的透明直到消失的方案

加入?kleampa/not-paid?后，如果設(shè)置的日期即將到來，那么網(wǎng)頁會(huì)逐天變得越來越透明，直到完全消失

是時(shí)候打造一款屬于自己的AI助手了

使用?leon-ai/leon? 即可打造屬于自己的AI助手

安裝過程中注意需要某些必要的包：如?brew install pipenv?

工具推薦

Animation in React

使用 React 寫動(dòng)畫并不容易，但是借用 @nearform/react-animation 提供的組件和預(yù)制的 keyframes，就會(huì)讓動(dòng)畫實(shí)現(xiàn)變得輕松起來

使用入門文章?

@nearform/react-animation in NPM?

Webpack 5 的新特性

介紹了 Webpack 5 即將帶來的新特性?New Features in Webpack 5?

通過持久緩存提高構(gòu)建性能

代碼拆分功能更加強(qiáng)大，更智能的分析模塊大小

Name Chunk ID 不需要在使用注釋定義，而是使用如下配置：

optimization: { chunkIds: "named" }

盡量遵循在內(nèi)部作出改變的原則，而不會(huì)破壞使用方式

熱門文章

給2019前端的5個(gè)建議?

不斷學(xué)習(xí) Redux/TypeScript 等等，造輪子覆蓋全鏈路，程序員一直在路上

近一萬字的ES6語法知識(shí)點(diǎn)補(bǔ)充?

ES2019 都來了，快來補(bǔ)充學(xué)習(xí)起來

研發(fā)團(tuán)隊(duì)資源成本優(yōu)化實(shí)踐?

主要介紹了成本投入與產(chǎn)出的背景、實(shí)踐過程中的幾個(gè)階段，可以對(duì)自己的團(tuán)隊(duì)管理進(jìn)行了一個(gè)對(duì)照和復(fù)盤

福利來了

春天來了，又到了金三銀四的季節(jié)，我們是阿里巴巴「研發(fā)效能部-體驗(yàn)技術(shù)」團(tuán)隊(duì)，一個(gè)集前端、視覺、交互的綜合性團(tuán)隊(duì)，致力于阿里集團(tuán)全球數(shù)據(jù)中心和DevOps的數(shù)字化、自動(dòng)化、智能化的體驗(yàn)設(shè)計(jì)和前端體系化建設(shè)，打造企業(yè)級(jí)數(shù)據(jù)可視化產(chǎn)品、探索未來前沿科技創(chuàng)新產(chǎn)品，這里有酒有故事，就等你來，簡(jiǎn)歷請(qǐng)投：thomasyang.ypf#alibaba-inc.com、longbo.ylb#alibaba-inc.com