Web開發(fā)主流框架技術(shù)研究

方阿麗

摘 要：隨著互聯(lián)網(wǎng)時代人們對軟件產(chǎn)品的需求與日俱增，框架技術(shù)在Web開發(fā)過程中的地位也越來越重要。目前，有很多前端開發(fā)框架技術(shù)和后端開發(fā)框架技術(shù)。文章主要針對Web開發(fā)過程中的主流前端框架技術(shù)和后端框架技術(shù)進行研究，從其功能概念、優(yōu)點、缺點等方面展開論述，為初學(xué)者和Web開發(fā)人員合理選擇框架技術(shù)進行學(xué)習(xí)和應(yīng)用提供參考。

關(guān)鍵詞：前端開發(fā);后端開發(fā);框架技術(shù)

0?引言

在如今的互聯(lián)網(wǎng)時代，信息技術(shù)與各行各業(yè)、千家萬戶的深入關(guān)聯(lián)，使得Web開發(fā)需求與日俱增。采用以往的方式進行開發(fā)，存在開發(fā)周期長、效率低、界面不完美、技術(shù)要求高、后期維護難度大等問題，各種框架技術(shù)的出現(xiàn)使以上問題迎刃而解，對于開發(fā)人員而言，利用合適的框架技術(shù)進行Web開發(fā)也變得游刃有余。

1 Web開發(fā)框架技術(shù)

Web框架技術(shù)，即Web開發(fā)過程中可重復(fù)使用的技術(shù)規(guī)范，使用框架可以幫助技術(shù)員快速開發(fā)特定的系統(tǒng)[1]。Web開發(fā)框架技術(shù)分前端開發(fā)框架技術(shù)和后端開發(fā)框架技術(shù)。

前端開發(fā)是創(chuàng)建Web頁面或APP等前端界面呈現(xiàn)給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術(shù)、框架、解決方案，來實現(xiàn)互聯(lián)網(wǎng)產(chǎn)品的用戶界面交互。前端框架技術(shù)的應(yīng)用使前端開發(fā)變得方便快捷。目前， Web前端開發(fā)框架有Vue，Angular，Boostrap，React等，這里將給大家介紹Vue，Angular，Boostrap 3種Web前端開發(fā)主流框架技術(shù)。

后端開發(fā)是運行在后臺并且控制前端的內(nèi)容，它負責(zé)程序設(shè)計架構(gòu)以及數(shù)據(jù)庫管理和處理相關(guān)的業(yè)務(wù)邏輯，主要考慮功能的實現(xiàn)以及數(shù)據(jù)的操作和信息的交互等。后端開發(fā)對開發(fā)團隊的技術(shù)要求相對較高，借助后端開發(fā)框架技術(shù)，可以簡化后端開發(fā)過程，使其變得相對容易。后端框架技術(shù)往往和后端功能實現(xiàn)所用的語言有關(guān)。目前，流行的Web后端框架技術(shù)有Laravel，Spring MVC，Spring Boot，Mybatis，Phoenix，Django，F(xiàn)lask等，本文將結(jié)合后端實現(xiàn)的語言為大家介紹Laravel，Spring Boot，Django 3種Web后端開發(fā)主流框架技術(shù)。

2 ? Web前端開發(fā)框架技術(shù)

2.1? Vue框架

Vue是一套可以自底向上逐層應(yīng)用的基于MVVM的漸進式框架，用于構(gòu)建用戶界面。其核心庫只關(guān)注視圖層，便于與第三方庫或已有項目整合，初學(xué)者容易上手。與工具鏈及各種支持類庫結(jié)合使用時，還能為復(fù)雜的單頁應(yīng)用提供驅(qū)動。其優(yōu)點有：（1）輕量高效，簡單易學(xué)。只關(guān)注構(gòu)建數(shù)據(jù)的view層，大小只有20 KB左右，簡單輕巧，虛擬DOM，靈活漸進式，運行速度快，還具有豐富完善的中文文檔，易于理解和學(xué)習(xí)。（2）組件化。通過組件，將一個單頁應(yīng)用中的各種模塊拆分到一個個單獨的組件（Component）中，方便重復(fù)使用，簡化調(diào)試步驟，提升整個項目的可維護性，便于協(xié)同開發(fā)。（3）響應(yīng)式數(shù)據(jù)綁定。響應(yīng)式數(shù)據(jù)綁定，也稱雙向數(shù)據(jù)綁定，即數(shù)據(jù)變化更新視圖，視圖變化更新數(shù)據(jù)。其采用數(shù)據(jù)劫持結(jié)合發(fā)布者—訂閱者模式，自動響應(yīng)數(shù)據(jù)變化，進行雙向更新，在瀏覽器渲染過程中節(jié)省了很多不必要的數(shù)據(jù)修改，提高了系統(tǒng)工作的效率。（4）用戶體驗好、快。視圖、數(shù)據(jù)和結(jié)構(gòu)的分離使數(shù)據(jù)的更改更為簡單，不需修改邏輯代碼，僅需操作數(shù)據(jù)就能完成相關(guān)操作。而且其內(nèi)容的改變不需要重新加載整個頁面，對服務(wù)器壓力較小，給用戶一個更為流暢和友好的體驗。Vue框架還存在一些缺點，比如：（1）初次加載耗時多，效率低。（2）大量封裝，不利于SEO，報錯又不明顯，復(fù)雜的頁面代碼非常累贅。（3）社區(qū)不大，功能僅限于view層，Ajax等功能需要額外的庫，這點對開發(fā)人員要求較高，同時存在瀏覽器支持的局限，不支持IE8瀏覽器。（4）生態(tài)環(huán)境小，維護風(fēng)險大。Vue框架是由個人開發(fā)團隊開發(fā)和維護的，其發(fā)展時間不長，隨著用戶的增多，維護風(fēng)險會比較大。

2.2? Angular框架

Angular是一種構(gòu)建動態(tài)Web應(yīng)用的結(jié)構(gòu)化框架，是為了克服HTML在構(gòu)建應(yīng)用上的不足而設(shè)計的，它把應(yīng)用程序數(shù)據(jù)綁定HTML元素，能在HTML元素“背后”添加代碼，還可以克隆、重復(fù)、隱藏或顯示HTML元素，支持輸入驗證，使得開發(fā)現(xiàn)代的單一頁面應(yīng)用程序SPAs變得更加容易。其優(yōu)點有：（1）指令豐富，模板功能強大，自帶了極其豐富的Angular指令，還可以自定義指令并能在項目中多次重復(fù)使用這些指令。（2）功能相對完善，包括模板、服務(wù)、數(shù)據(jù)雙向綁定、模塊化、路由、過濾器、依賴注入等所有功能。更多關(guān)注構(gòu)建CRUD（增刪改查）應(yīng)用，適用于大多數(shù)項目，可應(yīng)用于大型Web項目。（3）速度快，生產(chǎn)效率高。能將模板轉(zhuǎn)換成代碼，并能對代碼進行優(yōu)化，在服務(wù)器端渲染應(yīng)用的首屏幾乎瞬間展現(xiàn)，還能通過新的組件路由模塊實現(xiàn)快速加載，可以自動拆分代碼，為用戶單獨加載加速助力，利用簡單強大的模板語法創(chuàng)建UI視圖，大大提高了生產(chǎn)率。（4）強大的社區(qū)支持，它是由互聯(lián)網(wǎng)巨人谷歌開發(fā)，具有堅實的基礎(chǔ)和強大的社區(qū)支持。Angular框架還存在一些缺點，比如：（1）對于特別復(fù)雜的應(yīng)用場景，性能受瀏覽器限制，并且和某些瀏覽器的兼容性不是特別好，比如IE6.0。（2）在視圖嵌套上存在缺陷，目前沒有更好的方法實現(xiàn)多視圖嵌套。（3）頁面更新速度慢，當(dāng)頁面數(shù)據(jù)發(fā)生變化時，就會自動觸發(fā)臟值檢查機制，隨著頁面綁定的數(shù)據(jù)越來越多，頁面更新就會變得越來越慢。（4）缺乏輕量級的版本，用戶學(xué)起來相對不容易上手，表單校驗需要手寫指令提示錯誤，用起來相對麻煩。

2.3? Boostrap框架

Bootstrap是基于HTML，CSS，JavaScript 開發(fā)的簡潔、直觀、強悍的前端開發(fā)框架，具有特定網(wǎng)格系統(tǒng)和CSS媒體查詢功能，能夠確保響應(yīng)式開發(fā)更具穩(wěn)定性，解決目前出現(xiàn)的瀏覽器兼容或者屏幕分辨率等問題，使得 Web 開發(fā)更加方便快捷[2]。其優(yōu)點有：（1）豐富的組件，使快速搭建漂亮、功能完備的前端界面成為可能。包含下拉菜單、按鈕組、按鈕下拉菜單、導(dǎo)航、導(dǎo)航條、路徑導(dǎo)航、分頁、排版、縮略圖、警告對話框、進度條、媒體對象等組件。（2）支持插件，使組件動態(tài)化。包含模式對話框、標(biāo)簽頁、滾動條、彈出框等插件。豐富的組件和插件為前端敏捷開發(fā)提供資源平臺，從一定程度上可節(jié)約素材搜尋時間和插件，提高開發(fā)效率。 （3）跨瀏覽器、跨設(shè)備的響應(yīng)式設(shè)計。可兼容現(xiàn)代所有主流瀏覽器，能夠自適應(yīng)于不同分辨率的PC端、iPad和手機端，并且不同設(shè)備屏幕之間可以來回切換，移動設(shè)備優(yōu)先，適用于大型項目開發(fā)。（4）基于Less進行CSS預(yù)處理，可進行拓展并降低后期維護成本。Boostrap框架還存在一些缺點，比如：（1）定制會產(chǎn)生大量代碼冗余，不適合小型項目和特殊需求者。（2）對低版本的瀏覽器兼容性不好，頁面顯得死板。（3）數(shù)據(jù)加載和傳達受地域網(wǎng)絡(luò)限制。

目前，優(yōu)秀的前端開發(fā)框架很多，在選擇上建議：（1）和需求相匹配;（2）和瀏覽器兼容性好的框架;（3）組件豐富，支持插件的框架;（4）文檔豐富，社區(qū)大的框架;（5）高效的框架。

3 ? 后端開發(fā)框架技術(shù)

3.1? Laravel框架

Laravel是一個基于PHP的后端框架，其語法整潔優(yōu)雅，適合應(yīng)用各種開發(fā)模式，具有個性化的數(shù)據(jù)庫遷移系統(tǒng)和強大的生態(tài)系統(tǒng)，適應(yīng)大型團隊的開發(fā)能力。其優(yōu)點有：? （1）對象關(guān)系映射實現(xiàn)，使從數(shù)據(jù)庫中獲取數(shù)據(jù)變得非常容易，而且不必考慮數(shù)據(jù)庫的兼容性。（2）一站式路由處理，簡單直觀。用一個Web.php文件來處理所有路由，還具有路由分組和模型綁定功能，可以使視圖直接從路由本身返回，跨過訪問控制器。（3）按約定編程，忽略細節(jié)，使用戶輕松地工作。（4）開箱即用，在設(shè)置用戶身份驗證的同時創(chuàng)建所有重要的組件，簡單快捷。（5）提供最簡練和最有用的命令行接口Artisan，你只需要傳遞命令，剩下都交給框架來處理。（6）應(yīng)用模板使渲染速度更快，測試驅(qū)動開發(fā)使測試自動化。還存在一些缺點，比如：（1）組件式的框架，開發(fā)速度相對來說并不快。（2）輕量級的框架，內(nèi)置支持較少。（3）開發(fā)過程要求使用標(biāo)準(zhǔn)，缺乏指引文檔，初學(xué)者并不容易上手。

3.2? Spring Boot框架

Spring Boot是一個基于Java的組件一站式框架，簡化了新 Spring 應(yīng)用的初始搭建以及開發(fā)過程。使用特定的方式來進行配置，不再需要開發(fā)人員定義樣板化的配置方案，從而簡化使用Spring的難度[3]。其優(yōu)點有：（1）配置簡單，具有自動配置特性，開發(fā)項目只需要非常少的配置就可以搭建項目。（2）應(yīng)用命令行接口，結(jié)合自動配置，進一步簡化應(yīng)用開發(fā)過程。（3）依賴分組整合功能，使構(gòu)建一次性添加。? （4）快速體驗，簡化Spring編程模型。Spring Boot框架還存在一些缺點，比如：（1）依賴太多，造成沖突和冗余。（2）缺少服務(wù)的注冊和發(fā)現(xiàn)等解決方案。（3）缺少監(jiān)控集成和安全管理方案。

3.3? Django框架

Django是一個基于Python的高級全能型框架，功能完善、文檔齊全、開發(fā)敏捷、配置簡單，能夠快速地完成項目開發(fā)。其優(yōu)點有：（1）開源框架，完善的文檔。其廣泛的實踐案例和完善的在線文檔，給開發(fā)者搜索在線文檔解決問題帶來了便利。（2）功能完善，各種要素應(yīng)有盡有。自帶大量常用工具和框架，適合快速開發(fā)企業(yè)級網(wǎng)站。（3）強大的數(shù)據(jù)庫訪問組件，自助式后臺管理，使數(shù)據(jù)庫操作和完整的后臺數(shù)據(jù)管理變得異常容易。（4）可插播的APP設(shè)計理念和詳盡的debug信息，為個性化應(yīng)用和代碼錯誤的排查提供了便利。Django框架還存在一些缺點，比如：（1）重量級框架，對一些輕量級應(yīng)用來說會存在很多冗余。（2）過度封裝使改動起來比較麻煩。（3）模板問題使其靈活度變低。

目前，優(yōu)秀的后端開發(fā)框架很多，建議考慮：（1）和編程語言相匹配;（2）盡量選擇具有大量文檔和或大型社區(qū)的框架;（3）庫選擇有更多靈活性的框架;（4）安全性好的框架;（5）可擴展性強的框架。

4 結(jié)語

不管是Web前端框架還是后端框架，每個框架都有各自的特點和優(yōu)點缺點，都不盡完美，按需選擇，不過分苛求，能滿足需要即可。隨著互聯(lián)網(wǎng)的高速發(fā)展和技術(shù)的不斷更迭，以后還會出現(xiàn)更多、更優(yōu)秀的前后端開發(fā)框架，為開發(fā)者提供更為優(yōu)質(zhì)、高效的開發(fā)工具[4]。

[參考文獻]

[1]朱超.框架技術(shù)在信息系統(tǒng)開發(fā)中的應(yīng)用研究[J].網(wǎng)絡(luò)安全技術(shù)與應(yīng)用，2016（11）：78-79.

[2]盧愛芬.基于H5中的Bootstrap 框架技術(shù)的應(yīng)用與研究[J].電腦知識與技術(shù)，2020（3）：54-56.

[3]陳學(xué)明.基于Spring Boot+Ext JS 的企業(yè)應(yīng)用系統(tǒng)通用平臺的設(shè)計與實現(xiàn)[J].電腦知識與技術(shù)，2019（12）：63-66，69.

[4]閆海舟，賀秀麗.幾種常見前端開發(fā)框架的對比研究[J].無線互聯(lián)科技，2017（12）：46-47.

（編輯 王雪芬）