網(wǎng)站搭建的框架如何選擇？

時間：2024-01-18 19:54:01 | 來源：網(wǎng)站運營

時間：2024-01-18 19:54:01 來源：網(wǎng)站運營

網(wǎng)站搭建的框架如何選擇？：

JavaScript 框架概覽

開始一個新項目總是要做許多決定。其中一個關(guān)鍵決策就是選擇合適的框架或庫。幸運的是，Vue.js 是一個功能非常多樣化的庫，可以處理各種各樣的任務(wù)。

Vue.js

Vue.js 這個庫讓你可以將交互性和附加功能添加到任何使用 JavaScript 的編碼環(huán)境中。Vue 既可以在單獨的頁面上用來解決簡單的任務(wù)，也可以作為成熟的工業(yè)應(yīng)用程序的基礎(chǔ)。Vue.js 是一個用于構(gòu)建圖形用戶界面的高級框架。它也可以與一些現(xiàn)代工具和附加庫一起，用于構(gòu)建復(fù)雜的單向應(yīng)用程序。




Vue 庫其中一個最大的優(yōu)點是它不需要任何特殊知識。任何 Vue 應(yīng)用程序都是使用 HTML、CSS 和 JavaScript 編寫的——熟悉這些工具就可以立即投入工作。即使你以前從未做過客戶端開發(fā)，也可以基于以前的 MVC 設(shè)計模式使用經(jīng)驗進行構(gòu)建，這種模式與 MVVM 非常相似。

React

借助 React 庫，我們可以輕松地創(chuàng)建交互式用戶界面。集成 React 時，不需要更改當(dāng)前項目的代碼，它只負(fù)責(zé)渲染界面，不會額外帶來痛苦。




React 系統(tǒng)支持用戶界面更新，使得為應(yīng)用程序創(chuàng)建健壯的模塊化組件更加容易。React 庫通過數(shù)據(jù)更新來實現(xiàn)大部分用戶界面維護工作，這對開發(fā)人員來說非常令人愉快（難怪它如此受歡迎）。

Angular

Angular 差不多是一個完整的開發(fā)環(huán)境。它包含一整套程序，包括 TypeScript 編譯器、AOT 編譯器和 Web 服務(wù)器。Angular 的 Web 服務(wù)器用于調(diào)試使用這個框架開發(fā)的站點。它是用同一個 Angular CLI 實用程序啟動的，要啟動 Angular CLI，你需要在 Windows 命令行中進入項目文件夾，并執(zhí)行 ng serve 命令。

Vue、React 和 Angular 的主要特征

React 最大的其中一個優(yōu)勢是：在穩(wěn)定性和創(chuàng)新性之間做了很好的平衡，使得用戶比較容易適應(yīng)。這個原因以及其他一些原因使 React 保持了它的地位，并獲得越來越多的人氣。













圖片來源：https://insights.stackoverflow.com/trends?tags=reactjs%2Cvue.js%2Cangular%2Cangularjs

大小

開發(fā)框架的大小對未來應(yīng)用的性能至關(guān)重要?？蚣芎蛻?yīng)用程序必須在應(yīng)用程序開始正常工作之前加載。




在這方面，Angular 最復(fù)雜，有 143KB。React 次之，有 43KB，而 Vue.js 只有 23KB。除非你的應(yīng)用特別大，并且包含了大量的組件，否則最好使用更小的結(jié)構(gòu)。

性能

在 Web 項目中，性能與 DOM 密切相關(guān)：DOM 在瀏覽器 / 代碼中表示 Web 頁面。在發(fā)生更新時，你可以通過 DOM 控制 Web 頁面。




Vue、React 和 Angular 的性能會因為任務(wù)的不同而有所差異，但在大多數(shù)情況下，它們都非常高效和快速。React 和 Vue 都實現(xiàn)了 DOM。得益于其精心設(shè)計的結(jié)構(gòu)，Vue 提供了出色的性能和內(nèi)存分配。這就是 React 和 Vue.js 優(yōu)于 Angular 的地方：它們利用了虛擬 DOM——原始 DOM 的復(fù)本。




注意：DOM 是一種將 HTML 文檔的內(nèi)容表示為對象的方法。此外，還有一個用于管理指定對象的接口。DOM 分常規(guī) DOM（也稱為真 DOM）和虛擬 DOM。它們有什么區(qū)別呢？讓我們來看一個例子。如果你想修改在 HTML 標(biāo)簽中找到的某些信息，算法將會這樣做：真正的 DOM 將更新所有標(biāo)簽，直到它找到它需要的片段。在某些情況下，這會對性能和其他參數(shù)產(chǎn)生負(fù)面影響。虛擬 DOM 則只更新必要的 HTML 塊。

社區(qū)

React 是世界上最流行的框架，這已不是什么秘密。它越來越受歡迎，因為它提供了真正的 Promise。React 的 Mental Model 看起來很可靠，其組件讓創(chuàng)建用戶界面變得更容易，API 靈活且富有表現(xiàn)力，整個項目給人的感覺是就應(yīng)該那樣。對 API 庫的描述也友好，更容易給人留下良好的印象。




從那時起，React 庫在基本概念和 API 方面就基本保持不變，但已經(jīng)形成并發(fā)展出了一整套的知識和最佳實踐，越來越多的人在使用它。Angular 因其優(yōu)點而備受贊譽，并擁有大量的社區(qū)支持。遺憾的是，盡管 Vue.js 有很多好處，但它并沒有像它的競爭對手那樣被開發(fā)者所接受。




下面讓我們從流行度和相關(guān)性兩個方面比較下這三個框架：

• GitHub：目前，Vue.js 是最流行的框架，盡管它是最年輕的，這意味著越來越多的項目將使用它。
• 谷歌搜索：在谷歌搜索中，React 查詢請求最多，緊隨其后的是 Vue.js。目前最不受歡迎的是 Angular.js。Angular.js 的人氣在下降，而 Vue.js 的人氣卻在上升。
• 勞動力市場需求：大多數(shù)職位空缺與 React.js 有關(guān)，然后是 Angular，再然后才是 Vue.js。

Vue、React 和 Angular：該選哪個？

為了選出最合適的庫，你應(yīng)該首先仔細分析這些框架并理解自己的需求。無論是有許多依賴項的現(xiàn)有項目，還是你想使用熟悉的庫進行開發(fā)的新應(yīng)用程序，Vue 都不會給你帶來任何麻煩。你可以繼續(xù)使用 Bootstrap 或 Bulma 這樣的 CSS 框架，保留為?Query 或 Backbone 編寫的組件，集成你最喜歡的庫執(zhí)行 HTTP 請求，或使用 Promise 對象。




要開始使用 Vue 進行編程，你所要做的就是將 Vue.js 庫連接到 Web 頁面。不需要復(fù)雜的組裝工具！從頭到尾開發(fā)一個原型只需要 1 到 2 周的時間，這讓你能夠盡早并經(jīng)常地收集用戶反饋。Vue 2 引入了服務(wù)器端渲染（SSR）支持。這讓你可以最小化初期的數(shù)據(jù)加載，并根據(jù)需要請求新的視圖和資源。與高效的組件緩存相結(jié)合，可以進一步減少流量消耗。




React 庫能夠做一些令人驚嘆的事情。因為整個用戶界面都是用 JavaScript 定義的，所以你可以使用 JavaScript 的豐富功能在模板中執(zhí)行各種操作。你只會受到 JavaScript 特性的限制，而不會受到模板框架特性的限制。當(dāng)你想到完全用 JavaScript 定義的視覺效果時，你可能會想到很多引號、轉(zhuǎn)義字符和 createElement 調(diào)用。別擔(dān)心，React 庫允許你（選擇性地）使用可以與 JavaScript 代碼共存的 HTML-like JSX 語法定義可視元素。




React 與其他兩個框架在以下理念上有所不同：

• 與其說它是一個框架，不如說它是一個庫（最初是為了處理 UI 而創(chuàng)建的）；
• 因為它不受框架的限制，所以它的功能更多——更適合專業(yè)人士，而不是初學(xué)者；
• 在 Angular 中許多可以“開箱即用”的主要特性，在這里必須單獨連接（這種方法有優(yōu)點，也有缺點，對于初學(xué)者來說是缺點，因為需要做不必要的動作）；
• 更多地面向 JavaScript 而不是 TypeScript（盡管每個版本對 TS 的支持都在增加）；
• 更便于創(chuàng)建原生 Android 和 iOS 移動應(yīng)用程序；
• 擁有大量適用于各種場合的第三方庫（多于 Angular）。

Angular 已經(jīng)被用在了許多規(guī)模最大、最復(fù)雜的 Web 應(yīng)用程序中。













Angular 借鑒了服務(wù)器端開發(fā)中的一些最佳特性，并用它們來擴展瀏覽器中的 HTML 標(biāo)記。這樣，創(chuàng)建具有增強功能的應(yīng)用程序就更簡單輕松了。Angular 應(yīng)用程序基于 MVC 設(shè)計模式構(gòu)建，這個模型致力于創(chuàng)建具有以下特征的應(yīng)用程序：

• 易于擴展：如果你理解了基礎(chǔ)知識，即使是最復(fù)雜的 Angular 應(yīng)用，你也很容易就能夠理解，這意味著你可以很輕松地擴展應(yīng)用來提供實用的新功能。
• 易于維護：Angular 應(yīng)用程序很容易調(diào)試，Bug 很容易修復(fù)，這意味著長期運行的 Angular 應(yīng)用也很容易維護。
• 測試工具：Angular 有良好的 go mod 和端到端測試支持。因此，你可以在用戶遇到之前找到并修復(fù)它們。
• 標(biāo)準(zhǔn)化：Angular 基于瀏覽器的內(nèi)部功能，不會給你的工作帶來任何阻礙。這讓你可以創(chuàng)建符合標(biāo)準(zhǔn)的 Web 應(yīng)用程序，包含最新的功能（例如，各種 HTML5 API）、流行的工具和框架。
• 這是一個框架——這意味著它設(shè)定了創(chuàng)建 Web 應(yīng)用程序的規(guī)則，在初始階段設(shè)定了特定的框架，讓初學(xué)者可以少費腦筋。
• Angular 功能極多，如果需要額外的東西，可以連接第三方模塊。

Vue.js VS React：雙向數(shù)據(jù)綁定

在 Vue 中，你可以輕松地將組件變量綁定到表單字段。當(dāng)你更改變量時，表單字段會更新，當(dāng)用戶更改表單字段時，組件變量也會更新。這比編寫 React 中的事件處理程序要容易得多。




此外，很多人喜歡用圖表展示框架的受歡迎程度，其中 React 是 Angular 的 2 到 3 倍。它從創(chuàng)建移動應(yīng)用程序（React Native）中獲益頗多，因為與 Angular Ionic 相比，它更方便。至于 Web 應(yīng)用程序（ReactJS）開發(fā)方面，一切就沒那么簡單了。




例如，對于 Web 應(yīng)用程序，我發(fā)現(xiàn)，使用 Angular 比使用 ReactJS 更方便。




你可以自己嘗試并比較不同的方向或技術(shù)。為此，你可以在谷歌趨勢中輸入一些關(guān)鍵字，它會為你畫出漂亮的圖表。

Vue.js vs React vs Angular

與之前的框架不同，Vue.js 是由一個人創(chuàng)建的，他認(rèn)為 2013 年已經(jīng)有的框架都太復(fù)雜。Vue 的第一個和第二個版本都是由一個人創(chuàng)建的，因此，在某些方面，它可能比競爭對手更糟糕，尤其是在安全方面。Vue 3 是由一個開發(fā)團隊創(chuàng)建的，這意味著現(xiàn)在許多 Bug 和缺點都得到了修復(fù)，框架本身的效率也得到了提升。

我應(yīng)該學(xué)習(xí) React 還是 Angular？

最好同時學(xué)習(xí) Angular 和 React。這兩種框架各有優(yōu)缺點。專家建議初學(xué)者首先學(xué)習(xí) Angular，因為你所需的一切都是“開箱即用”的，這樣更不容易犯錯（框架會幫你控制）。在學(xué)習(xí)了 Angular 之后，你可以學(xué)習(xí) ReactJS 和 React Native。另外，如果你只需要移動應(yīng)用，你也可以直接跳到 React Native。事實上，你只需要學(xué)習(xí)框架的特性，僅此而已。其余的知識都是通用的（OOP、TypeScript、RP）。學(xué)習(xí)框架本身 1 到 2 周就足夠了，你已經(jīng)可以創(chuàng)建簡單的 Web 應(yīng)用程序了。

結(jié)束語

顯然，這三個框架都非常強大，但同時又很不一樣。它們有自己的優(yōu)勢和劣勢，沒有一個通用的公式可以用來決出一個絕對的贏家。選哪個框架好，要看你正在創(chuàng)建的應(yīng)用程序和你的特定需求。在做決定之前有必要進行全面的研究。對于那些從事商業(yè)投資而不是單個項目的公司來說，這一點尤其重要。