Hi！這裡是 Jing Tech 前端技術週報！除了 Substack 電子報外，也可以在筆者的部落格 jing-tech.me 與 instagram: jing.tech 關注前端大小事！
本週熱點與選讀
文章
[Series] Speeding up the JavaScript ecosystem
此系列文章介紹了許多如何加速與診斷 JS 應用以及如何優化，非常值得一讀！
The Front End Developer/Engineer Handbook 2024
這本前端工程師的指引手冊是由 Frontend Master 所推出，涵蓋了前端工程所涉及的各項技術，且介紹的每項前端技術都附有許多實用連結。
Mutation events will be removed from Chrome
Chromium 在今年七月 (127 版) 後會正式移除對 Mutation Event 的支援，儘管這個 API 已經被標示為棄用 10 多年，且替代的 API
MutationObserver也已經是廣泛採用的方法，但還是有少部份套件沒有做遷移，而使用這些套件的應用也會受到影響，像是常見的富文本套件 quill v1 需要更新到 v2 以免應用受到影響。Fix Your Annoying Popups with the CloseWatcher API
CloseWatcher API 是提供一個統一的接口用於監聽元素是否被關閉甚至攔截請求。可惜的是，該 API 在 Chrome 120 版發布之後出現了 Bug， 因此在 121 版之後被移除，但還是可以期待該 API 在未來普及後，前端開發者將不再需要針對不同平台處理關閉請求。
How to generate color palettes for design systems
文章詳細介紹了 Stripe 如何擴充其內部設計系統「Sail」的色彩系統，其中提到許多科學理論來解釋色彩的呈現原理，最後也提供內部生成顏色的 JS 源碼。
HTML attributes vs DOM properties
文章詳細的介紹了兩者不同之處與，也是筆者在日常開發中不會注意到的小細節，同時也介紹了各大框架如何處理兩者之間的關係。
在 HTML 中
<div></div>其實不等於<div />，也會造成意想不到的結果，如果想了解更深入的話可以看這篇文章。
熱點
"React 19 adds full support for custom elements and passes all tests on Custom Elements Everywhere."
React 19 Beta 版本在本週推出，包含了已經在 Next.js 中先行引入的 RSC 與其相關功能，同時也有新的 Hooks 以及支援預載資源與非同步腳本、控制樣式表載入順序以及語法的優化。最後 Custom Element 也將會在這版完整支援，也代表未來基於 Web Components 所開發的元件庫，也可以考慮納入技術選型，給團隊帶來更多彈性。
影音
由 Google Chrome 團隊發布的影片，介紹如何除錯及優化 INP 影片，非常推薦。
Podcast
本週 Jing Tech 新文章
這裡會列出近期 Jing Tech 部落格發布的新文章，與 Jing Tech 的技術週報不同，部落格中包含了更多的程式互動範例，讓讀者能夠更容易地理解。非常歡迎讀者反饋與指教！
富奸，延至下週發布《如何設計一個 Carousel - 實作篇》。
本期內容就更新到這裡，感謝大家的閱讀，如果有任何問題或想法歡迎一起討論，也歡迎分享給更多人知道！你的每一份支持，都是我持續創作的動力！更多關於我的創作可以點擊這裡。
Happy Coding!