前端框架選擇關鍵點
選擇合適的企業級前端框架，需考量框架的規模、靈活性、離線支持、服務器端渲染以及成熟度等因素。 實踐經驗至關重要，作者團隊曾使用Aurelia和React構建身份驗證頁面進行評估。
最終選擇React，主要基於其成熟度、社區支持和易於招聘。 Angular 2因未能滿足大部分選擇標準而被淘汰。 Vue和Aurelia表現出色，也符合要求，但招聘經驗豐富的開發者成為最終決定性因素。
在評估新加坡員工福利初創公司CXA集團的核心網絡平台時，我們決定放棄老化的現有架構，從頭重建前端。平檯面臨的挑戰之一是創建一個在CXA集團遍布亞洲的12個目標國家都能良好運行的Web應用程序。
考慮到項目交付的嚴格期限，我主導了對一系列前端JavaScript框架的評估。在大型企業項目中，很少有機會進行這種程度的變更，因此我們在評估過程中力求盡可能周全。
這個決定關係重大：隨著業務的指數級增長，我們承擔不起任何失誤。我們還必須考慮到團隊中沒有人對我們正在考慮的任何框架有重要的經驗。
縮小範圍
新的前端框架似乎每天都在發布，因此我們進行了元分析以減少我們考慮的框架範圍。包括我們聽說過的或推薦給我們的框架，我們最終選擇了Angular 2（聽說過）、Aurelia（聽說過）、Vue.js（推薦）和React（推薦）。
我們根據關鍵要求列表衡量每個入圍框架的排名。一些要求基於我們知道項目所需的內容，而另一些則展望我們想要做什麼。
我們選擇的框架需要提供一系列配置選項，並且相對易於定制。這似乎很大程度上取決於架構理念：代表你做出架構決策，還是完全開放這些決策。
Angular 2位於這一端的整體式結構，為你做出了每一個選擇（狀態服務器、路由器、處理程序）。這樣做的好處是，它很容易快速上手，而潛在的成本是模塊無法按照你的需要工作，而且無處可去。
React、Vue和Aurelia位於量表的另一端，提供了根據需要交換組件的能力。 Aurelia和Vue在其初始設置中具有可配置的樣板，這比React具有關鍵優勢。
與Vue一樣，React本身只提供了構建某些東西所需內容的一小部分。從那裡，必須做出許多決定，這當然令人望而生畏。自從React首次發布以來，已經創建了各種樣板（包括React Boilerplate和Create React App）來簡化引入過程。
對於我們的測試React項目，我們決定放棄任何特定的樣板，直接深入研究。我們仍然安裝了一些，即使只是為了參考代碼。這種方法當然很困難，但我們學習了關於React堆棧中每個組件的很多知識，並且對最終結果更有信心。
Vue和Aurelia憑藉其降低的學習曲線和模塊化結構贏得了這一輪。 React即使初始設置明顯更難，也獲得了部分靈活性積分。
借助Service Workers等API，Web應用程序無需實時或穩定的互聯網連接即可運行成為可能。在我們的團隊中，我們在這方面還沒有太多經驗，除了確認所有評估的框架都提供某種形式的離線支持外，我們沒有深入研究。
發送到客戶端的代碼字節大小對瀏覽器性能有很大影響，這既包括帶寬也包括處理器時間。隨著自定義代碼和第三方庫的添加，字節大小只會越來越大，因此從小處著手至關重要。 CXA集團的目標市場延伸到帶寬非常寶貴的國家，因此向客戶交付盡可能少的代碼至關重要。
由於缺乏反映生產配置的硬數據，我們查看了核心庫的大小，以至少對我們將面臨的情況有所了解。實際的生產大小比這裡顯示的要大。
Vue的開發人員已經盡最大努力將他們的核心庫縮小到令人印象深刻的23 KB。 React和Aurelia位於中間位置（大約分別為42 KB和64 KB），而Angular 2仍然是一個重量級選手，超過143 KB（包括用於狀態管理的RxJS）。
實際上，Vue、Aurelia和React的生產版本彼此之間非常接近，可以考慮在內。 Angular 2再次以錯誤的方式脫穎而出。
早期的單頁應用程序（SPA）框架遵循將所有代碼發送到客戶端的模型。這意味著頁面的初始渲染留給客戶端，並且直接導致初始頁面加載速度緩慢。 SPA中服務器端渲染的概念將初始渲染的負擔放在服務器上，允許在該渲染之後延遲加載所有其他內容。
Vue和React使用插件添加服務器端渲染。 Angular 2目前正在將其Universal功能合併到核心，儘管其功能與Vue或React提供的功能不匹配。 Aurelia將服務器端渲染標記為開發中的功能，但即使它擁有其他性能技巧，也缺乏實施時間表。
在為企業級網站選擇框架時，廣泛的社區支持、穩定性和招聘能力非常重要的因素。很難推測任何框架在三年後是否仍然受支持，但我們決定查看每個框架的當前健康狀況以做出決定。
查看框架的初始公開發布日期讓我們了解每個框架的穩健性。至少在理論上，較舊的庫應該具有更好的功能範圍和更少的重大錯誤。
React輕鬆獲勝，其首次公開發布是在2013年3月。儘管Vue最初於2015年10月發布，但直到2016年9月發布版本2才達到頂峰。 Aurelia是一個新手，於2016年8月達到1.0版。
Angular 2很有趣：它與版本1有很大不同，實際上，它於2016年9月首次發布。
這項評估的一部分包括深入研究每個庫的開發歷史，而不僅僅是發布日期本身。漫長而穩定的開發歷史——即使是在測試版中——當然也增強了信心。
各種團隊成員一直在關注候選框架的開發，這讓我們至少對每個框架的整體穩定性有所了解。在我們審查的所有框架中，Angular 2 問題重重的開發歷史脫穎而出，存在重大的重大更改和不明確的發布日期。該框架最終發布了最終版本，但在過程中確實很混亂。
成熟度的最終關鍵方面（如上所述）是招聘經驗豐富的員工的能力。鑑於我們的團隊在評估的框架方面的經驗有限以及我們面臨的激進時間表，我們希望招聘經驗豐富的開發人員。
然而，招聘具有特定經驗的人員可能會受到限制，但在像我們這樣的較大項目中確實會產生影響。我們在此階段淘汰了Angular 2，因為它未能滿足我們之前的許多要求。
對於剩餘的框架，我們首先搜索了不同的求職網站，並為每個框架發布了單獨的招聘廣告。我們沒有找到Aurelia或Vue的招聘廣告，也沒有收到任何申請。相比之下，我們發現有幾份React工作機會，並且我們收到了許多高質量的申請。
我們列表中的其餘功能——開發人員工具和單元測試支持——在我們查看的所有框架中都提供。如果沒有可靠的開發人員工具，調試幾乎是不可能的，而單元測試對於像我們這樣的企業級應用程序來說幾乎是必不可少的。
實踐經驗
任何理論都無法與實踐經驗相提並論。考慮到這一點，我們選擇了滿足大多數要求的兩個框架——Aurelia和React——並開始並行編碼。在此階段省略Vue沒有充分的理由；我們只是沒有足夠的時間來評估。
給定的任務是構建身份驗證屏幕，使其與我們現有應用程序的基本功能匹配：登錄、調用API和建立會話。兩位團隊成員分別分配了一個框架，並被給予一個日曆週的時間來查看他們可以構建的內容。
Aurelia演示更完整，部分原因在於更簡單的設置過程。在選擇每個部分所做的工作之後，我們確實感覺我們對React堆棧內部的內容有了更好的理解。 Aurelia在初始設置的簡易性方面仍然輕鬆獲勝。
我們無法僅根據實踐編碼得出任何重要的結論。也許唯一令人驚訝的是代碼有多麼相似：這很大程度上要歸功於ECMAScript 6中引入的結構更改，這兩個框架都使用了ECMAScript 6。
結果
最終，我們的選擇是React；最重要的是，它選擇了其成熟度、社區支持和易於招聘。雖然React是我們標準的明顯贏家，但很高興看到我們所查看的競爭框架中存在如此高質量的框架。
Vue和Aurelia被證明是緊隨其後的競爭對手。 Vue憑藉更完整的功能列表略微領先，但鑑於我們的要求，任何一個都可能很好地服務。如果我們沒有時間壓力，招聘就不那麼重要了，我們會將我們的實踐工作擴展到包括Vue。
Angular 2未能滿足我們的大部分選擇標準而令人失望。儘管它有很多優點，但它顯然不適合我們。
在選擇React並開始構建我們的項目後，我們不太可能很快再次進行這樣的評估。至於你，你會在我們的列表中添加哪些標準？我們錯過了什麼，我們本可以做得更好？我期待您的評論和建議。
本文由Stuart Mitchell、Ralph Mason和Vildan Softic同行評審。感謝所有SitePoint的同行評審員，使SitePoint的內容達到最佳狀態！
選擇適合您公司的正確前端框架的常見問題
為您的公司選擇前端框架時，您應該考慮幾個關鍵因素。首先，考慮項目需求。不同的框架具有不同的優缺點，因此選擇一個與您的項目需求相符的框架非常重要。其次，考慮學習曲線。有些框架比其他框架更容易學習，這會影響開發速度。第三，考慮社區和支持。強大的社區可以在您遇到問題時提供寶貴的資源和幫助。最後，考慮框架的性能和大小。輕量級、高性能的框架可以帶來更好的用戶體驗。
前端框架的大小會嚴重影響其性能。較大的框架通常帶有更多功能和功能，但加載和運行速度也可能較慢。這可能會導致較差的用戶體驗，尤其是在較慢的互聯網連接或功能較弱的設備上。另一方面，較小的框架通常更快、更高效，但它們可能缺乏某些功能或功能。因此，根據您的項目需求平衡框架的大小和性能非常重要。
有許多流行的前端框架，每個框架都有其自身的優勢。例如，React以其虛擬DOM和高性能而聞名，使其成為複雜動態Web應用程序的良好選擇。另一方面，Angular是一個功能齊全的框架，其中包含構建Web應用程序所需的一切，使其成為大型項目的良好選擇。 Vue.js以其簡單易用而聞名，使其成為小型項目或前端框架新手開發人員的良好選擇。
選擇前端框架時，社區支持非常重要。強大的社區可以提供豐富的資源，包括教程、文檔和論壇，您可以在其中提問並獲得幫助。此外，大型社區通常表明該框架很流行且被廣泛使用，這可能導致更頻繁的更新和改進。
雖然從技術上講可以在單個項目中使用多個前端框架，但這通常不建議這樣做。每個框架都有自己的做事方式，混合它們會導致混亂和復雜性。相反，通常最好選擇最適合您的項目需求的框架並堅持使用它。
前端框架的學習曲線會嚴重影響項目開發。學習曲線陡峭的框架可能需要更長的時間才能掌握，這可能會延遲開發的開始。另一方面，學習曲線平緩的框架可以讓您更快地開始開發。但是，易於學習不應該是選擇框架的唯一因素。還必須考慮框架的功能以及它與項目需求的匹配程度。
前端框架在Web開發中起著至關重要的作用。它為代碼提供了結構，使其更易於維護和擴展。它還為常見任務提供預先編寫的代碼，從而加快開發過程。此外，前端框架通常包括用於測試和調試的工具，從而更容易確保代碼的質量。
保持前端框架最新非常重要。更新通常包括錯誤修復、性能改進和新功能。但是，更新框架也可能會引入破壞現有代碼的更改，因此在更新後徹底測試您的應用程序非常重要。一般來說，您應該在發布新的穩定版本後立即更新您的框架。
整體式和微型前端框架之間的決定取決於您的項目需求。整體式框架在一個包中提供您需要的一切，這可以簡化開發，但也可能包含不必要的功能。另一方面，微型框架只提供基礎知識，允許您只添加所需的功能。這可能導致更輕量、更高效的應用程序，但它也可能需要更多工作來設置和維護。
有許多資源可用於了解更多關於前端框架的信息。在線教程、文檔和課程是一個很好的起點。 Stack Overflow和GitHub等網站也可以提供寶貴的見解和示例。此外，許多框架都有自己的社區，您可以在其中提問並向其他開發人員學習。
以上是如何為公司選擇右前端框架的詳細內容。更多資訊請關注PHP中文網其他相關文章！
