Netflix 對 Landing Page 的效能改善計畫...

幹掉 React (噗):

官方帳號丟戰文出來... 後面就有人開始亂 XDDD

不過先拉回來看... 依照說明,其他頁面都還是跑 React,只有 Landing Page 被改寫,看起來 Landing Page 的 TTI (Time to Interactive) 是他們的 KPI,所以就被拿出來另外處理了...

當然也有可能有其他的陰謀論 (而且我覺得可能性是在的):因為之前 React 的專利問題,變成之後 Facebook 如果真的出手提出告訴,會以惡意侵權來告 (因為鬧這麼大以後,沒有理由裝作不知道了)。這次只換 Landing Page 可以當作是試水溫練功 (累積 migration 的經驗),後續再換內頁...

Node.js 安全性更新:zlib...

前幾天「Node.js 預定在十月 24 號發表安全性更新」提到 Node.js 會發表安全性更新,已經看到 4/6/8 都出新版了:「Node v4.8.5 (Maintenance)」、「Node v6.11.5 (LTS)」、「Node v8.8.0 (Current)」。

這次安全更新的 CVECVE-2017-14919

CVE-2017-14919 - In zlib v1.2.9, a change was made that causes an error to be raised when a raw deflate stream is initialized with windowBits set to 8. On some versions this crashes Node and you cannot recover from it, while on some versions it throws an exception. Node.js will now gracefully set windowBits to 9 replicating the legacy behavior to avoid a DOS vector. nodejs-private/node-private#95

zlib 的 manualwindowBits 說明:

For the current implementation of deflate(), a windowBits value of 8 (a window size of 256 bytes) is not supported. As a result, a request for 8 will result in 9 (a 512-byte window). In that case, providing 8 to inflateInit2() will result in an error when the zlib header with 9 is checked against the initialization of inflate(). The remedy is to not use 8 with deflateInit2() with this initialization, or at least in that case use 9 with inflateInit2().

唔?XD

另外文章可以看出來 Node.js 團隊是選擇在 GitHub 上用另外一個 organization 在管這類不會事前公開的事情...

nvm 換 n

前幾天在 Twitter 上抱怨 nvm 很慢,導致 Zsh 開起來很頓 (然後也同步到 Facebook 上):

原因在於 .bashrc 或是 .zshrc 內初始化 nvm 時會呼叫 npm config get prefix,而這個命令很慢:「`npm config get prefix` takes incredibly long (7 - 70 seconds) #14458」。

後來在 Facebook 的留言處有朋友提了幾個方案... 其中一個是 n,花了些時間看軟體架構,有夠簡單... XD 對於不是拿 Node.js 開發的人應該是夠用了 (我只拿來跑一些用 Node.js 寫的工具)。

整個軟體就一個 shell script,把他丟進 ~/bin/ 裡面 (我有把 ~/bin/ 放到 PATH 裡),就可以用了。透過 N_PREFIX 設定他的基地 (預設是 /usr/local,我是設成 $HOME),剩下就跑 n lts,他就把 nodenpm 兩個檔案裝好給你用。

路徑的部份要自己設定,將 $N_PREFIX/node_modules/.bin 放進 PATH,這樣安裝起來的模組如果有可執行工具可以用才能直接跑 (像是 gulp.js 的命令)。

另外,之所以會說不適合開發者用的部份,是因為 module 是跨版本共用的 (切換 node 版本時就是用另外一個版本配上去 XD),所以比較不適合開發者使用...

CircleCI 的隱私問題

作者看 CircleCI 網站時發現的問題:「CircleCI trusts 8 analytics companies with your source code and API tokens」。

CircleCI 網站引用了這八個網站的 javascript:

  • Pusher
  • Intercom
  • Launch Darkly
  • Amplitude
  • Appcues
  • Quora (??)
  • elev.io
  • Optimizely

有些有很明顯目的而且也夠大,但有些就沒聽過了... 不過照 BuiltWith 上分析的資料「circleci.com Technology Profile」,遠超過這些啊 XDDD

可以看到 GitHub 站上只引用了 Facebook (不過這是哪邊出現的啊?),另外因為使用 Fastly 的 CDN 服務,所以 Fastly 也是屬於 GitHub 的信任名單;這兩家都算夠大的 vendor:「github.com Technology Profile」。

Travis CI 則是 Google Analytics 與 Fastly,也是兩家夠大的 vendor:「travis-ci.com Technology Profile」。

所以對於很注重這資安方面的人,應該還算是有選擇...

現代 JavaScript 常見的特性

GitHub 上「mbeaudru/modern-js-cheatsheet」這邊看到的,標題「Cheatsheet for the JavaScript knowledge you will frequently encounter in modern projects.」說明了文章的主題...

大約花了半個小時看完,範例給的都蠻不錯的,讓人容易了解...

Cloudflare 也能在各端點跑 JavaScript 了

類似於 AWS 先前推出的 Using CloudFront with Lambda@Edge (參考「在 CloudFront 的 edge 上跑 Lambda」以及「Lambda@Edge 的 GA」),Cloudflare 也推出了類似的功能:「Introducing Cloudflare Workers: Run Javascript Service Workers at the Edge」、「Code Everywhere: Why We Built Cloudflare Workers」。

整個系統是架構在 Chrome V8 上,尤其是安全性的部分是 Cloudflare 的人頗讚賞的重點:

Security: The V8 JavaScript engine is arguably the most scrutinized code sandbox in the history of computing, and the Chrome security team is one of the best in the world. Moreover, Google pays massive bug bounties to anyone who can find a vulnerability. (That said, we have added additional layers of our own sandboxing on top of V8.)

比較不一樣的地方在於 Cloudflare 拿 Service Worker API 來設計他們的架構,AWS 則是自己幹了一套出來...

然後現在還沒給出價錢,也還沒完全開放使用... 想要玩的人需要申請 beta。

直接在網頁上使用 WebTorrent

看到 GitHub 上的「mikeal/webtorrent-component」這個專案,可以很方便直接嵌入 BitTorrent 的資源,像是這樣嵌:

<script src="https://cdn.jsdelivr.net/npm/webtorrent-component@latest/dist/webtorrent-component.min.js"></script>

<web-torrent src="magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F&xs=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2Fsintel.torrent" file="Sintel.mp4" />

如果拿來跟「Using BitTorrent with Amazon S3」用的話可以在量大的時候省一些頻寬,並且在量小的時候還是維持有 seed (透過 Amazon S3 的服務做)。

Facebook 決定修改原先的授權條款

Facebook 在各個單位的砲火下決定將本來的 BSD+Patents 授權改為 MIT license:「Relicensing React, Jest, Flow, and Immutable.js」。

Next week, we are going to relicense our open source projects React, Jest, Flow, and Immutable.js under the MIT license.

後面講了很多場面話,聽聽就好... 改成 MIT license 最大的理由應該還是在 PR 面的傷害。

V8 對 Hash Flooding 的防禦措施

Hash Flooding 問題是指 Hash 這個資料結構是可以被預測 collision 所造成的問題,在隨機的情況下會是 O(1) 的操作,在特定挑選故意讓他 collision 而變成 O(n),當有 n 個元素時,乘起來就會變成 O(n^2)。這算是一種阻斷攻擊 (DoS attack)。

在「About that hash flooding vulnerability in Node.js...」這邊提到了 V8 之前為了避免 Hash Flooding 的問題,關掉了 Startup snapshot 而造成的效能問題,以及後續的很多故事,最後找了長期的解法。

這個解法已經併入 Node.js 裡,預定下個包括的版本是 8.3.0:

The patch to re-enable startup snapshot has been merged into Node.js. It is part of the recent Node.js v8.3.0 release.

不過這表示現有的 LTS (4.8.4 以及 6.11.2) 還是... XD

Google Chrome 59 之後的新功能:看 CSS 與 JS 的 Coverage

在「What's New In DevTools (Chrome 59)」這邊看到 Google Chrome 59 後所推出新的工具,可以看目前網頁的 CSS 與 JS 跑過的 coverage 比率。

像是這樣,總大小以及未使用的比率:

然後可以再直接看有哪些部份沒跑到:

可以拿來分析,降低使用者下載的量。不過真的要切的話好像不太好做...