鐵人檔案
Web 前端效能攸關使用者是否願意再次來訪，重要度不容忽視。希望藉由這三十天的分享幫助自己整理所學，也讓有興趣的人可以有個指南。
從第一篇講到現在，相信各位對於瀏覽器的運作有更深的認識了吧？前面之所以講這麼多瀏覽器的運作原理，就是在為了這一篇文章鋪路。 什麼是 Critical rende...
事實上 Web Performance 是非常大的議題，因此我並不期盼在這三十天當中將所有東西都講完，而是希望能夠讓讀者扎實地掌握基本的概念、知識。我會在最後一...
前面講到 Paint 時有提到 jank ，說了很多理論，沒有看到還是很難感受一下是什麼感覺。請大家再次訪問我們的測試專案。 接著請點擊「啟動瘋狂模式」的按鈕，...
現在我們已經針對測試專案做了移除 document.write 的優化了，然而現在還有一個問題：Javascript 會阻擋 DOM 的建構。 麻煩的地方在於，...
我們在「什麼是 Critical rendering path ？」那一篇提到基本上大部份的優化 Tips 都是環繞在「降低 Critical Path Len...
經過前面幾篇的優化後，這是我們的成品：https://81ea55eb1460e512c8faef7f6ed1f2403cd62635-www.googledr...
透過前面的練習專案，我們學了不少東西，最後這幾篇文章，我打算介紹幾個效能監測工具，這一系列文章即將進入尾聲囉！ Navigation Timing API 是一...
YSlow 是 Yahoo 開發的瀏覽器 Plugin ，為監測網頁效能必裝的工具之一。之前的文章，我們有介紹到 Google 的 PageSpeed Insi...
除了前面兩篇介紹的工具之外，這一篇文章要介紹的工具你「絕對」不能錯過，因為它的功能太強大了。 今天要介紹的就是這個網站： WebPagetest 今天一樣拿我的...
沒想到已經到了第三十天了，這種將一件事做到底的感覺真的很不錯。原本我希望能夠寫更多內容的，只是礙於當初定題目時是以 Frontend Performance 為...
