企業(yè)門(mén)戶(hù)前端渲染引擎的制作方法
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及信息技術(shù)領(lǐng)域,具體的說(shuō),是企業(yè)門(mén)戶(hù)前端渲染引擎。
【背景技術(shù)】
[0002]長(zhǎng)期以來(lái),企業(yè)門(mén)戶(hù)都是采用傳統(tǒng)的方式展現(xiàn)門(mén)戶(hù),即由JSP/ASP在服務(wù)器端進(jìn)行計(jì)算,然后發(fā)送大量的文字給客戶(hù)端。這樣的弊端就是服務(wù)器需要大量的運(yùn)算和占用比較多的帶寬。如果用戶(hù)量比較多,會(huì)給服務(wù)器造成一定的壓力。
[0003]企業(yè)門(mén)戶(hù)采用服務(wù)器運(yùn)算,將最終生成的界面發(fā)送到客戶(hù)端。如果用戶(hù)量達(dá)到很多的時(shí)候,需要不斷提升硬件性能以支撐大量的運(yùn)算,高性能的硬件設(shè)備成本較高且無(wú)法徹底解決服務(wù)器生成界面的問(wèn)題。
【發(fā)明內(nèi)容】
[0004]本發(fā)明的目的在于提供企業(yè)門(mén)戶(hù)前端渲染引擎,解決服務(wù)器性能瓶頸問(wèn)題,采用靜態(tài)化文件存儲(chǔ)數(shù)據(jù)庫(kù)中的數(shù)據(jù),利用客戶(hù)端瀏覽器緩存靜態(tài)文件的原理,某些沒(méi)有變化的文件只需要加載一次就不用再次加載,在讀取數(shù)據(jù)時(shí),界面數(shù)據(jù)只需要從靜態(tài)文件中讀取,從而縮短界面響應(yīng)時(shí)間,降低服務(wù)器壓力。
[0005]本發(fā)明通過(guò)下述技術(shù)方案實(shí)現(xiàn):用設(shè)計(jì)器設(shè)計(jì)好門(mén)戶(hù)后,將設(shè)計(jì)器數(shù)據(jù)庫(kù)內(nèi)的外殼、皮膚、菜單、界面用javascript技術(shù)組裝到瀏覽器中,進(jìn)行靜態(tài)文件格式化,然后從靜態(tài)文件中取出數(shù)據(jù)進(jìn)行畫(huà)面渲染,在使用時(shí)瀏覽器下載一次后,存放在緩存中,并通過(guò)算法將固定的數(shù)據(jù)組裝成一個(gè)完整的門(mén)戶(hù)界面,解決服務(wù)器性能瓶頸問(wèn)題,采用靜態(tài)化文件存儲(chǔ)數(shù)據(jù)庫(kù)中的數(shù)據(jù),利用客戶(hù)端瀏覽器緩存靜態(tài)文件的原理,某些沒(méi)有變化的文件只需要加載一次就不用再次加載,在讀取數(shù)據(jù)時(shí),界面數(shù)據(jù)只需要從靜態(tài)文件中讀取,從而縮短界面響應(yīng)時(shí)間,降低服務(wù)器壓力。
[0006]進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述用設(shè)計(jì)器設(shè)計(jì)好門(mén)戶(hù)包括以下具體步驟:
(1)將門(mén)戶(hù)模型數(shù)據(jù)、外殼模型數(shù)據(jù)、菜單模型數(shù)據(jù)、皮膚模型數(shù)據(jù)、界面模型數(shù)據(jù)集成在設(shè)計(jì)器數(shù)據(jù)庫(kù)內(nèi);
(2)外殼渲染:從外殼模型數(shù)據(jù)中取出數(shù)據(jù),將數(shù)據(jù)組裝成樹(shù)型結(jié)構(gòu),將組裝后的數(shù)據(jù)交給外殼渲染層;外殼渲染層將外殼內(nèi)容取出用javascript技術(shù)渲染到瀏覽器中;
(3)皮膚渲染:從皮膚模型數(shù)據(jù)中取出使用的CSS路徑信息數(shù)據(jù),將CSS路徑信息數(shù)據(jù)組成合法的link標(biāo)簽數(shù)據(jù),將link標(biāo)簽數(shù)據(jù)交給皮膚渲染層;皮膚渲染層將link標(biāo)簽用javascript技術(shù)植染到瀏覽器中;
(4)菜單渲染:從菜單模型數(shù)據(jù)中取出菜單對(duì)象,從界面模型數(shù)據(jù)中取出用戶(hù)建立的界面數(shù)據(jù),將菜單對(duì)象和界面數(shù)據(jù)傳給菜單渲染層;菜單渲染層將菜單對(duì)象中的模板和界面數(shù)據(jù)拼裝成一個(gè)完整的HTML片段用javascript技術(shù)植染到外殼中指定的菜單區(qū)域;
(5)界面浸染:從界面模型數(shù)據(jù)內(nèi)將布局表數(shù)據(jù)和組件表數(shù)據(jù)取出,將布局表數(shù)據(jù)和組件表數(shù)據(jù)傳給界面渲染層;界面渲染層取得當(dāng)前選中的界面,并將布局和界面中需要的組件取出;將布局內(nèi)容渲染到外殼指定的內(nèi)容區(qū),并在每個(gè)組件中找到組件要渲染到布局中的位置用javascript技術(shù)將組件植染到布局中;
(6)完成門(mén)戶(hù)設(shè)計(jì)。
[0007]進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述外殼浸染層是底層接口只接收數(shù)據(jù)來(lái)渲染門(mén)戶(hù)外殼,外殼中指定菜單、內(nèi)容區(qū)顯示位置;所述皮膚浸染層是底層接口只接收數(shù)據(jù)來(lái)渲染門(mén)戶(hù)皮膚。
[0008]進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述“將設(shè)計(jì)器數(shù)據(jù)庫(kù)內(nèi)的外殼、皮膚、菜單、界面用javascript技術(shù)組裝到瀏覽器中,進(jìn)行靜態(tài)文件格式化,然后從靜態(tài)文件中取出數(shù)據(jù)進(jìn)行畫(huà)面渲染,在使用時(shí)瀏覽器下載一次后,存放在緩存中,并通過(guò)算法將固定的數(shù)據(jù)組裝成一個(gè)完整的門(mén)戶(hù)界面”包括以下具體步驟:
O前端格式化數(shù)據(jù)處理:將設(shè)計(jì)器數(shù)據(jù)庫(kù)中的數(shù)據(jù)轉(zhuǎn)化成JSON格式的文字存儲(chǔ)到瀏覽器支持的靜態(tài)文件中,靜態(tài)文件以JS文件形式存在;
2)外殼渲染:從靜態(tài)文件中取得外殼模型數(shù)據(jù),將外殼模型數(shù)據(jù)傳給外殼渲染層;夕卜殼渲染層將外殼內(nèi)容取出用javascript技術(shù)渲染到瀏覽器中;
3)菜單渲染:從靜態(tài)文件中取出菜單對(duì)象和用戶(hù)建立的界面數(shù)據(jù),將菜單對(duì)象和界面數(shù)據(jù)傳給菜單渲染層;菜單渲染層將菜單對(duì)象中的模板和界面數(shù)據(jù)拼裝成一個(gè)完整的HTML片段用javascript技術(shù)植染到外殼中指定的菜單區(qū)域;
4)界面浸染:從靜態(tài)文件中取出布局表數(shù)據(jù)和組件表數(shù)據(jù),將布局表數(shù)據(jù)和組件表數(shù)據(jù)傳給界面渲染層;界面渲染層取得當(dāng)前選中的界面,并將布局和界面中需要的組件取出;將布局內(nèi)容渲染到外殼指定的內(nèi)容區(qū),并在每個(gè)組件中找到組件要渲染到布局中的位置用javascript技術(shù)將組件植染到布局中;
5)形成完整的門(mén)戶(hù)界面。
[0009]進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述外殼浸染層是底層接口只接收數(shù)據(jù)來(lái)渲染門(mén)戶(hù)外殼,外殼中指定菜單、內(nèi)容區(qū)顯示位置;所述皮膚浸染層是底層接口只接收數(shù)據(jù)來(lái)渲染門(mén)戶(hù)皮膚。
[0010]進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述界面內(nèi)設(shè)置有布局和組件。
[0011]本發(fā)明與現(xiàn)有技術(shù)相比,具有以下優(yōu)點(diǎn)及有益效果:
(I)本發(fā)明解決服務(wù)器性能瓶頸問(wèn)題,采用靜態(tài)化文件存儲(chǔ)數(shù)據(jù)庫(kù)中的數(shù)據(jù),利用客戶(hù)端瀏覽器緩存靜態(tài)文件的原理,某些沒(méi)有變化的文件只需要加載一次就不用再次加載,在讀取數(shù)據(jù)時(shí),界面數(shù)據(jù)只需要從靜態(tài)文件中讀取,從而縮短界面響應(yīng)時(shí)間,降低服務(wù)器壓力。
[0012](2)本發(fā)明在使用時(shí),可把界面大量的運(yùn)算分散給各個(gè)客戶(hù)端,即減輕服務(wù)器壓力又節(jié)省帶寬。
[0013](3)本發(fā)明從數(shù)據(jù)庫(kù)中取數(shù)據(jù)進(jìn)行畫(huà)面渲染采用界面設(shè)計(jì)方式,從靜態(tài)文件中取出數(shù)據(jù)進(jìn)行畫(huà)面渲染是門(mén)戶(hù)發(fā)布后,且為大量的用戶(hù)提供訪問(wèn)界面。
[0014](4)本發(fā)明利用瀏覽器可以緩存站點(diǎn)的文件,減少請(qǐng)求,和帶寬的浪費(fèi);利用JSON的特點(diǎn),在存儲(chǔ)對(duì)象信息時(shí),以樹(shù)形結(jié)構(gòu)存儲(chǔ),便于查找和使用。
[0015](5)本發(fā)明在使用時(shí),HTML加載javascript文件后,在瀏覽器端使用的時(shí)候就是對(duì)象化,不需要在做任何處理。
【附圖說(shuō)明】
[0016]圖1為本發(fā)明的流程圖。
【具體實(shí)施方式】
[0017]下面結(jié)合實(shí)施例對(duì)本發(fā)明作進(jìn)一步地詳細(xì)說(shuō)明,但本發(fā)明的實(shí)施方式不限于此。
[0018]企業(yè)門(mén)戶(hù):一個(gè)聯(lián)接企業(yè)內(nèi)部和外部的網(wǎng)站,它可以為企業(yè)提供一個(gè)單一的訪問(wèn)企業(yè)各種信息資源的入口,企業(yè)的員工、客戶(hù)、合作伙伴和供應(yīng)商等等都可以通過(guò)這個(gè)門(mén)戶(hù)獲得個(gè)性化的信息和服務(wù)。
[0019]前端:客戶(hù)端(Client)或稱(chēng)為用戶(hù)端,是指與服務(wù)器相對(duì)應(yīng),為客戶(hù)提供本地服務(wù)的程序。除了一些只在本地運(yùn)行的應(yīng)用程序之外,一般安裝在普通的客戶(hù)機(jī)上,需要與服務(wù)端互相配合運(yùn)行。
[0020]渲染:從模型生成圖像的過(guò)程。模型是用嚴(yán)格定義的語(yǔ)言或者數(shù)據(jù)結(jié)構(gòu)對(duì)于三維物體的描述,它包括幾何、視點(diǎn)、紋理以及照明信息。
[0021]實(shí)施例1:
企業(yè)門(mén)戶(hù)前端渲染引擎,用設(shè)計(jì)器設(shè)計(jì)好門(mén)戶(hù)后,將設(shè)計(jì)器數(shù)據(jù)庫(kù)內(nèi)的外殼、皮膚、菜單、界面用javascript技術(shù)組裝到瀏覽器中,進(jìn)行靜態(tài)文件格式化,然后從靜態(tài)文件中取出數(shù)據(jù)進(jìn)行畫(huà)面渲染,在使用時(shí)瀏覽器下載一次后,存放在緩存中,并通過(guò)算法將固定的數(shù)據(jù)組裝成一個(gè)完整的門(mén)戶(hù)界面,解決服務(wù)器性能瓶頸問(wèn)題,采用靜態(tài)化文件存儲(chǔ)數(shù)據(jù)庫(kù)中的數(shù)據(jù),利用客戶(hù)端瀏覽器緩存靜態(tài)文件的原理,某些沒(méi)有變化的文件只需要加載一次就不用再次加載,在讀取數(shù)據(jù)時(shí),界面數(shù)據(jù)只需要從靜態(tài)文件中讀取,從而縮短界面響應(yīng)時(shí)間,降低服務(wù)器壓力。
[0022]實(shí)施例2:
本實(shí)施例是在上述實(shí)施例的基礎(chǔ)上進(jìn)一步優(yōu)化,進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述用設(shè)計(jì)器設(shè)計(jì)好門(mén)戶(hù)包括以下具體步驟:
(1)將門(mén)戶(hù)模型數(shù)據(jù)、外殼模型數(shù)據(jù)、菜單模型數(shù)據(jù)、皮膚模型數(shù)據(jù)、界面模型數(shù)據(jù)集成在設(shè)計(jì)器數(shù)據(jù)庫(kù)內(nèi);
(2)外殼渲染:從外殼模型數(shù)據(jù)中取出數(shù)據(jù),將數(shù)據(jù)組裝成樹(shù)型結(jié)構(gòu),將組裝后的數(shù)據(jù)交給外殼渲染層;外殼渲染層將外殼內(nèi)容取出用javascript技術(shù)渲染到瀏覽器中;
(3)皮膚渲染:從皮膚模型數(shù)據(jù)中取出使用的CSS路徑信息數(shù)據(jù),將CSS路徑信息數(shù)據(jù)組成合法的link標(biāo)簽數(shù)據(jù),將link標(biāo)簽數(shù)據(jù)交給皮膚渲染層;皮膚渲染層將link標(biāo)簽用javascript技術(shù)植染到瀏覽器中;
(4)菜單渲染:從菜單模型數(shù)據(jù)中取出菜單對(duì)象,從界面模型數(shù)據(jù)中取出用戶(hù)建立的界面數(shù)據(jù),將菜單對(duì)象和界面數(shù)據(jù)傳給菜單渲染層;菜單渲染層將菜單對(duì)象中的模板和界面數(shù)據(jù)拼裝成一個(gè)完整的HTML片段用javascript技術(shù)植染到外殼中指定的菜單區(qū)域;
(5)界面浸染:從界面模型數(shù)據(jù)內(nèi)將布局表數(shù)據(jù)和組件表數(shù)據(jù)取出,將布局表數(shù)據(jù)和組件表數(shù)據(jù)傳給界面渲染層;界面渲染層取得當(dāng)前選中的界面,并將布局和界面中需要的組件取出;將布局內(nèi)容渲染到外殼指定的內(nèi)容區(qū),并在每個(gè)組件中找到組件要渲染到布局中的位置用javascript技術(shù)將組件植染到布局中; (6)完成門(mén)戶(hù)設(shè)計(jì)。
[0023]實(shí)施例3:
本實(shí)施例是在上述實(shí)施例的基礎(chǔ)上進(jìn)一步優(yōu)化,進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述外殼浸染層是底層接口只接收數(shù)據(jù)來(lái)渲染門(mén)戶(hù)外殼,外殼中指定菜單、內(nèi)容區(qū)顯示位置;所述皮膚浸染層是底層接口只接收數(shù)據(jù)來(lái)渲染門(mén)戶(hù)皮膚。
[0024]實(shí)施例4:
本實(shí)施例是在上述任一實(shí)施例的基礎(chǔ)上進(jìn)一步優(yōu)化,進(jìn)一步的,為更好的實(shí)現(xiàn)本發(fā)明,所述“將設(shè)計(jì)器數(shù)據(jù)庫(kù)內(nèi)的外殼、皮膚、菜單、界面用javascript技術(shù)組裝到瀏覽器中,進(jìn)行靜態(tài)文件格式化,然后從靜態(tài)文件中取出數(shù)據(jù)進(jìn)行畫(huà)面渲染,在使用時(shí)瀏覽器下載一次后,存放在緩存中,并通過(guò)算法將固定的數(shù)據(jù)組裝成一個(gè)完整的門(mén)戶(hù)界面”包括以下具體步驟:
O前端格式化數(shù)據(jù)處理:將設(shè)計(jì)器數(shù)據(jù)庫(kù)中的數(shù)據(jù)轉(zhuǎn)化成JSON格式的文字存儲(chǔ)到瀏覽器支持的靜態(tài)文件中,靜態(tài)文件