李春曉 陳平 周偉 趙強

摘 ? 要：視圖的首次響應時間和平均響應時間深刻影響著Web應用的開發(fā)效率和運行效率。文章設計了一種模板語言，通過開發(fā)翻譯器分別生成動態(tài)語言和靜態(tài)語言源碼，實現(xiàn)視圖在開發(fā)過程中解釋動態(tài)語言執(zhí)行，而發(fā)布時編譯靜態(tài)語言執(zhí)行，并支持熱部署。仿真實驗結果顯示：視圖首次響應時間的均值減少86.47%、標準差減少51.77%。對148個視圖的開發(fā)日志分析表明，文章方法能在保障軟件運行效率的同時，提高軟件的開發(fā)效率，具有廣泛的應用前景。

關鍵詞：混合編程;視圖引擎;模板語言;Web開發(fā);開發(fā)效率;熱部署

中圖分類號：TP311.52 ? ? ? ?文獻標志碼：A ? ? ? ?文章編號：1673-8454（2022）03-0119-05

一、引言

MVC（Model-View-Controller）模式在Small-talk-80的GUI設計中被提出[1]，其分離了數(shù)據(jù)處理、程序輸入輸出控制及數(shù)據(jù)表示，且描述了各層之間的通信方式，有利于構建“松耦合、高內聚”的組件， 使程序結構變得清晰而靈活[2]。多數(shù)現(xiàn)代編程語言都實現(xiàn)并開源了各自的MVC開發(fā)框架，如Java Spring、C# ASP.NET MVC、PHP Laravel等。

MVC逐漸成為Web開發(fā)的標準模式[3]，并被廣泛應用到各類Web項目的開發(fā)中[4-8]。以Java和C#為代表的靜態(tài)語言，通過類型的強制聲明，使得集成開發(fā)環(huán)境有很強的代碼感知能力。對應的基于J2EE和ASP.NET的MVC框架，在實現(xiàn)復雜業(yè)務邏輯的管理信息系統(tǒng)研發(fā)中得到很大發(fā)展[9][10]。然而其視圖引擎需要使用靜態(tài)語言編譯，會消耗大量的計算資源，首次響應時間較長，在調試和測試中消耗了大量開發(fā)者的時間。

隨著移動互聯(lián)網(wǎng)的飛速發(fā)展，各類Web應用的研發(fā)速度受到越來越多的重視?；赑ython、PHP、JavaScript等動態(tài)語言的MVC框架逐漸受到業(yè)界的更多關注[11][12]。據(jù)代碼托管平臺（Github）統(tǒng)計，截至2020年5月15日，各編程語言對應的MVC開發(fā)框架獲得的星數(shù)中，動態(tài)語言開發(fā)框架的星數(shù)明顯多于靜態(tài)語言。這是因為動態(tài)語言運行效率雖低于靜態(tài)語言，但其具有可解釋運行、啟動速度快、首次響應時間低、開發(fā)效率較高等優(yōu)點。

本文設計并實現(xiàn)了一種視圖引擎，利用動態(tài)語言和靜態(tài)語言混合編程的方法，結合動態(tài)語言和靜態(tài)語言的優(yōu)勢，使開發(fā)過程中視圖具有較低的首次響應時間，提高開發(fā)體驗。軟件發(fā)布后也有較低的平均響應時間，能夠保障運行效率。

二、視圖引擎概述

視圖是應用與外界的接口，也是MVC模式中最接近用戶的層，更是模型的外在表現(xiàn)。在Web應用中，視圖引擎負責為視圖創(chuàng)建瀏覽器可解析的超文本標記語言（HTML）。其通過模板與模型綁定的方式，利用母版、組件等設計，實現(xiàn)模板復用，提高Web應用的開發(fā)效率。

（一）視圖引擎介紹

視圖引擎的核心是模板語言。引擎將模板語言翻譯為程序語言源代碼，并由對應的編譯器或解釋器執(zhí)行。模板語言是一種超文本標記語言與程序語言的混合體。一種MVC開發(fā)框架通常提供一種默認的視圖引擎，同時也支持視圖引擎的自定義。不同模板語言基于不同的程序語言與HTML混合，雖然有一定的語法差異，但是其核心結構類似[13]。

圖1所示為Razor模板語言的示例，其通過“@”在HTML代碼中標記C#代碼，訪問時將Web請求中的服務器變量全部以列表的形式顯示出來。除Razor外，其他模板語言也以類似的特殊字符標記程序語言區(qū)塊表示控制流程，如“{% code %}”（Jinja2）、“<{ code }>”（Smarty），以“{{ expression }}”（Jinja2）標記表達式。

視圖引擎在軟件研發(fā)中的主要意義有：①簡化字符串的拼接，能更快速生成各類復雜格式的源代碼，如實體類、增刪改查（CRUD）的基本代碼;②使HTML可嵌入控制流程和占位符，實現(xiàn)模板數(shù)據(jù)的填充工作;③具有一定的數(shù)學運算和中間值處理能力;④通過母版和組件的設計實現(xiàn)模板復用。

（二）視圖引擎工作流程

在MVC模式中，控制器調用服務實現(xiàn)業(yè)務邏輯，生成業(yè)務模型和確定要加載的視圖。視圖引擎實現(xiàn)業(yè)務模型與模板的綁定，將視圖繪制成HTML。首先，翻譯器根據(jù)模板語言的詞法規(guī)則和語法規(guī)則，通過詞法分析器和語法分析器生成類或函數(shù)的源代碼;然后，靜態(tài)語言通過編譯器將源代碼編譯為成可執(zhí)行的機器碼，或動態(tài)語言通過解釋器將源代碼解釋為可執(zhí)行的機器碼;最后，將模型作為可執(zhí)行代碼輸入，輸出為最終的HTML字符串。工作流程如圖2所示。

靜態(tài)語言需要編譯的特性將導致模板字符串到可執(zhí)行代碼耗時較長，可執(zhí)行代碼生成HTML字符串耗時較短，而生成目標HTML較快，表現(xiàn)為首次響應時間較長，平均響應時間較短。相應地，動態(tài)語言將導致模板字符串到可執(zhí)行代碼耗時較短，而可執(zhí)行代碼生成HTML字符串耗時較長。視圖是MVC模式中變化最頻繁的，用戶界面的開發(fā)也需要多次預覽視圖的執(zhí)行結果。因此，首次響應時間較長，將增加軟件開發(fā)過程中調試和測試的耗時，影響開發(fā)體驗。平均響應時間則是應用吞吐量的重要指標。

三、高性能視圖引擎設計

本文利用動態(tài)語言和靜態(tài)語言混合編程的方法，設計了一種模版語言，并分別構建動態(tài)語言和靜態(tài)語言的翻譯器，能在優(yōu)化視圖首次響應時間的同時，保證視圖的平均響應時間。該引擎涉及混合編程、腳本引擎、模板翻譯、緩存、熱部署等關鍵技術。

（一）混合編程

混合編程是指使用兩種或兩種以上的程序設計語言來開發(fā)應用程序的過程。各類程序設計語言通常是針對某一個特定領域而設計，如用于Web開發(fā)的PHP、統(tǒng)計分析的R、數(shù)據(jù)處理的SQL等。而一些通用的語言，如C++、Java、Python、C#等，則通過各種類型的框架基本實現(xiàn)全應用場景的支持。

Python是一門結合了解釋性、編譯性、互動性和面向對象的腳本語言，被業(yè)界稱為“膠水”語言[14]。其可以與各種語言無縫對接，也可以嵌入到其他語言中執(zhí)行，本文方法采用C#與Python混合編程方法。

（二）模板翻譯器

HTML是一種特殊的可擴展標記語言（XML）。通過C#語言將HTML模板語言分別翻譯成Python源代碼和C#源代碼。在開發(fā)階段，利用Python解釋器，生成HTML;在發(fā)布后，利用C#編譯器動態(tài)編譯后，調用程序集生成HTML。如圖3所示，上部代碼為模板語言，中間代碼為翻譯成的Python源代碼，下部代碼為生成的HTML。

（三）腳本引擎

腳本引擎（Script Engine）為程序語言提供了運行過程中擴充自身功能的能力，能提高軟件構建的靈活性。Java的javax.Script包中和C#中的Microsoft.Scripting類均提供了與JavaScript、Python等腳本語言交互的標準接口。

本文使用IronPython包提供的PythonEngine作為腳本引擎，實現(xiàn)在應用運行過程中解釋Python源代碼執(zhí)行。將模型數(shù)據(jù)作為參數(shù)傳遞給根據(jù)模板翻譯生成的函數(shù)，可實現(xiàn)模板的熱更新，即在無需重啟應用的情況下更新模板，為軟件開發(fā)過程中模塊的測試和調試帶來便利。

四、實驗環(huán)境與評測

為了更好地感受和測試視圖引擎的性能，本文使用開源硬件“樹莓派4B”作為測試平臺，搭建實驗環(huán)境，對性能進行仿真測試。其主要指標包括首次響應時間和平均響應時間，同時對真實的大型管理信息系統(tǒng)開發(fā)日志進行分析評測。

（一）系統(tǒng)實驗環(huán)境

“樹莓派4B”是一種開源硬件平臺，搭載了博通最新的BCM2711處理器，以4枚ARM A72核心，主頻為1.5GHZ。本文選用其1GB內存版本為作測試平臺，操作系統(tǒng)選用Raspbian Buster Lite。測試應用運行環(huán)境為Mono，版本號為6.8.0.105。Web服務器為Jexus，版本號為 6.2.1.12。測試的模板為AdminLTE，它是GitHub上一個開源的HTML管理后臺框架。

（二）首次響應時間測試

筆者分別使用Razor引擎與本文視圖引擎實現(xiàn)AdminLTE模板，并在開發(fā)模式運行。圖4所示為經(jīng)30次測試記錄的首次響應時間繪制的箱線圖。使用正態(tài)分布進行估計，Razor引擎首次耗時的分布為N（2887.47，30.432），本文引擎首次耗時分布為N（390.67，14.672）。Razor引擎首次運行耗時接近3秒，能明顯地感覺到延時，影響了開發(fā)體驗和開發(fā)效率。本文引擎首次運行耗時約減少86.47%，且標準差減少了51.77%，能提供更好的開發(fā)體驗，提高開發(fā)效率。

（三）吞吐量測試

Http_load是一款基于Linux平臺的Web服務器性能測試工具，用于測試Web服務器的吞吐量與負載、Web頁面的性能。

分別使用1～10個并發(fā)針對AdminLTE的本文引擎動態(tài)和靜態(tài)語言版本進行測試，并繪制散點圖，如圖5所示。測試結果顯示，該模板在動態(tài)語言解釋和靜態(tài)語言編譯后執(zhí)行時，性能表現(xiàn)相近。這表明，在占位符填充場景，采用動態(tài)語言解釋執(zhí)行有較好的性能。

（四）開發(fā)日志分析

本文實現(xiàn)的視圖引擎通過訂閱模板保存事件的方法，記錄了視圖所有的變化歷史。該方法已應用于北京師范大學研究生管理系統(tǒng)、研究生招生管理系統(tǒng)、大型考試考務管理系統(tǒng)的開發(fā)中[15]，并記錄了視圖模板的變更記錄[16]。

北京師范大學研究生管理系統(tǒng)實現(xiàn)了研究生學籍、培養(yǎng)過程和學位授予的全流程管理，是一個具有1000多個表和視圖的業(yè)務復雜的管理信息系統(tǒng)。開發(fā)日志共記錄了148個視圖模板，共5970次變更，平均每個視圖變更40余次。根據(jù)變更次數(shù)繪制如圖6所示的直方圖。圖6顯示，超過69.6%的視圖模板變更過5次以上，有30次以上變更的視圖占比達32.4%。從開發(fā)日志的統(tǒng)計數(shù)據(jù)可以發(fā)現(xiàn)，在開發(fā)過程中需要對視圖進行頻繁修改、調試和測試，實現(xiàn)復雜業(yè)務邏輯。分析結果表明，使用動態(tài)語言視圖引擎對提高開發(fā)效率有幫助。

五、結語

本文基于動態(tài)語言Python和靜態(tài)語言C#混合編程，設計了兩種模板翻譯器，并利用腳本引擎、緩存和熱部署機制實現(xiàn)了一種高性能的視圖引擎。其具有啟動速度快，運行效率高，系統(tǒng)穩(wěn)定性好的特點，并且能記錄詳細的開發(fā)和運行日志，保障運行效率，提高開發(fā)效率。

通過系統(tǒng)仿真表明，動態(tài)語言和靜態(tài)語言相比，無需對源代碼進行編譯執(zhí)行，啟動速度明顯較高，在占位符填充場景性能相近;在循環(huán)流程控制等方面則性能差距較明顯。因此，動態(tài)語言視圖引擎確實能夠提供更好的開發(fā)體驗，提高開發(fā)效率。而在一些流程復雜的場景下，在發(fā)布時采用靜態(tài)語言翻譯器構建視圖引擎也是有意義的。本文視圖引擎結合了動態(tài)語言和靜態(tài)語言的優(yōu)勢，具有跨平臺、高性能的特點。

參考文獻：

[1]KRASNER G， POPE S. A description of the model- view-controller user interface paradigm in the smalltalk-80 system[J]. Journal of Object Oriented Programming， 1988，1（3）： 26-49.

[2]劉亮，霍劍青，郭玉剛，等.基于MVC的通用型模式的設計與實現(xiàn)[J].中國科學技術大學學報，2010，40（6）： 635-639.

[3]LEFF A， RAYFIELD J T. Web-application development using the model/view/controller design pattern[C]// In Proceedings fifth ieee international enterprise distributed object computing conference， 2011：118-127.

[4]賈順賀，陳建飛，陳古運，等.基于MVC架構的個人健康信息管理系統(tǒng)設計與實現(xiàn)[J].計算機應用與軟件，2018，35（3）：43-48.

[5]肖文娟，王加勝.基于Vue和Spring Boot的校園記錄管理Web App的設計與實現(xiàn)[J].計算機應用與軟件，2020，37（4）：25-30.

[6]王杰，錢旦敏，婁帥，等.基于大數(shù)據(jù)的住院醫(yī)師規(guī)范化培訓系統(tǒng)設計與實現(xiàn)[J].計算機應用與軟件，2018，35（3）：61-66.

[7]路遙，范雪松.基于多層次結構的高校教代會提案管理信息系統(tǒng)設計與實現(xiàn)[J].計算機應用與軟件，2019，36（12）：36-39.

[8]周偉，吳穎，徐昶，等.大型考試考務管理系統(tǒng)設計與實現(xiàn)[J].中國教育信息化，2017（7）：69-71.

[9]仝茵.基于ASP.NET MVC模式的軟件開發(fā)架構的研究與探討[J].中國電子科學研究院學報，2016，11（6）：599-602.

[10]張宇，王映輝，張翔南.基于Spring的MVC框架設計與實現(xiàn)[J].計算機工程，2010，36（4）：59-62.

[11]宋尚平，李興保.PHP模板引擎Smarty的安裝配置及應用實現(xiàn)[J].現(xiàn)代教育技術，2007（9）：80-82.

[12]牛作東，李捍東.基于Python與Flask工具搭建可高效開發(fā)的實用型MVC框架[J].計算機應用與軟件，2019，36（7）：21-25.

[13]姬一文，吳慶波，楊沙洲.一種服務器端模板引擎的改進與實現(xiàn)[J].計算機應用研究，2011，28（3）：1077-1079.

[14]宮薇薇，齊向春，裴世廉.Python與R語言混合編程方法的研究和應用[J].計算機應用與軟件，2018，35（1）：28-31.

[15]周偉，張弛，徐昶.博士生招生“申請-考核”制的雙向匿名評價系統(tǒng)研究[J].學位與研究生教育，2017（3）：21-25.

[16]周偉，蔡瑩，王天楠，等.基于構件的管理信息系統(tǒng)云開發(fā)平臺研究[J].中國教育信息化，2016（7）：28-32.

作者簡介：

李春曉，北京師范大學信息化建設辦公室信息網(wǎng)絡中心，博士生;

陳平，北京師范大學科研院副處長、信息網(wǎng)絡中心副主任、教授級高級工程師、碩士生導師;

周偉，北京師范大學教務部，博士生，通訊作者，郵箱：zhouwei@bnu.edu.cn;

趙強，北京師范大學教務部，博士生。

High-Performance View Engine Construction Method Based on Hybrid Programming

Chunxiao LI1， Ping CHEN1，2， Wei ZHOU3，4*， Qiang ZHAO3

（1.Center of Information & Network Tecknology， Beijing Normal University， Beijing 100875;

2.Administration for Research and Development， Beijing Normal University， Beijing 100875;

3.Provost’s office and Academic Affairs （Graduate School）， Beijing Normal University， Beijing 100875;

4.National Engineering Laboratory for Cyberlearning and Intelligent Technology， Beijing Normal University， Beijing 100875）

Abstract： The first response and average response time period of the view have a profound impact on the efficiency of Web application development and operation. This paper designed a template language and developed a translator to generate source code for dynamic language and static language， respectively. Views are rendered by interpretation of dynamic language during the development process， and published by execution of static language compilation support. The simulation results indicated that the mean value of the first response time of the view reduced by 86.47%， and the standard deviation reduced by 51.77%. The analysis of the development log of 148 views indicated that this method can guarantee the operation efficiency and improve the development efficiency of software， which will have a broad application prospect.

Keywords： Bybrid programming; View engine; Template language; Web development; Development efficiency; Hot deployment

編輯：王曉明 ? ?校對：李曉萍