前端三十｜17. [FE] 為什麼現在的前端都在用「框架」？
現在打開任何一間求職網站，搜尋前端相關職缺，幾乎每間公司的職缺都會在求職條件或加分項目中提到目前的三大框架：React、Vue、Angular；或著也可以到 GitHub 上搜尋 Awesome Javascript，其中的 Framework 數量也是琳瑯滿目，其中也能看到三大框架驚人的星星數量；這麼熱門的技術，身為開發者的我們好像不跟著用也不太對，但到底為什麼好像全世界都在用「框架」呢？
本系列文已經重新編校彙整編輯成冊，並正式出版囉！
《前端三十：從 HTML 到瀏覽器渲染的前端開發者必備心法》好評販售中！
喜歡我文章內容的讀者們，歡迎您前往購買支持！
沒有框架的日子
先回想一下在沒有框架的時候，開發者的日常會長什麼樣子吧。
那時最流行的「套件」非 jQuery 莫屬了，語法簡潔、直覺好用的元素選取器，語法便捷的事件監聽註冊，豐富的開發者生態系產出大量的開源套件，以及最重要的，弭平瀏覽器 XHR 差異的 ajax 函式，將複雜的瀏覽器差異藏在套件中，讓開發者只需要專注在想實作的邏輯即可。
透過好用的元素選取器及事件監聽，開發者們可以依據使用者的行為，靈活操作 DOM 元素的結構及樣式，jQuery 的這些特色直到 2019 的現在，都仍是很實用的功能，甚至 程式碼本身 也有許多值得開發者學習的地方；但隨著專案規模逐漸增大，程式複雜度不斷上升，直接操作 DOM 的缺點也就逐漸浮出檯面：
難以維護
HTML、CSS、JavaScript 無法維持原先的各司其職，因為需要透過 JavaScript 處理互動內容，勢必要將結構、樣式寫到 JavaScript 的部份中，也就因此造成架構耦合度提高，程式碼管理困難。
效能低落
在 本系列文的第三篇：Reflow 及 Repaint 是什麼？ 中有提到 Render Tree 的概念，當 DOM 被改變，勢必要觸發整個 Reflow & Repaint 的流程，頻繁的改動觸發重複渲染，便會讓頁面效能被消耗殆盡。
