国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
如何實(shí)現(xiàn)前端微服務(wù)化?


為了保證可讀性,本文采用意譯而非直譯。另外,本文版權(quán)歸原作者所有,翻譯僅用于學(xué)習(xí)。

對于網(wǎng)頁應(yīng)用,現(xiàn)代的開發(fā)方法使得前端部分變得越來越大,與之對應(yīng)的后端反而變小。我們的網(wǎng)站Weld的代碼中90%都是前端相關(guān)。我可以想象大多數(shù)現(xiàn)代的網(wǎng)頁應(yīng)用都類似。

網(wǎng)頁應(yīng)用一直在演化,網(wǎng)頁開發(fā)的技術(shù)也在不斷進(jìn)步?,F(xiàn)代的開發(fā)甚至依賴于在同一個項(xiàng)目中使用多個不同的框架。比如我們使用一些依賴于jQuery、AngularJS 1.x的舊的模塊,和React、Vue里面的新模塊。

單一框架無法應(yīng)對大型網(wǎng)頁應(yīng)用

我們需要一種方法可以把一個大的項(xiàng)目拆分成很多個小的模塊,讓它們獨(dú)自運(yùn)行。

舉個例子:
- myapp.com:使用靜態(tài)HTML技術(shù)構(gòu)建的靜態(tài)頁面。
- myapp.com/settings:使用AngularJS 1.x 構(gòu)建的舊的設(shè)置頁面。
- myapp.com/dashboard:使用React構(gòu)建的新的控制面板。

能夠想象我們需要如下技術(shù):
- 一個共享的JavaScript代碼庫比如用于管理路由和用戶會話,以及一些共享的CSS。當(dāng)然要越少越好。
- 一堆獨(dú)立的模塊,也就是微應(yīng)用(‘mini-app’)。每一個使用各自的框架搭建,使用不同的代碼庫管理。
- 一個可以將所有模塊連接起來的發(fā)布系統(tǒng),可以將整個服務(wù)運(yùn)行。任何模塊的更新都會觸發(fā)服務(wù)的重啟。

前端微服務(wù)化

正如大家想到的,那就是前端微服務(wù)化。像Spotify, Klarna, Zalando, UpworkAllegro都使用前端微服務(wù)化技術(shù)來構(gòu)架他們的網(wǎng)頁應(yīng)用。

實(shí)現(xiàn)方案

我總結(jié)了一下幾種實(shí)現(xiàn)方案:

  1. 我認(rèn)為最好的方案是Single-SPA “meta framework”可以在一個頁面將多個不同的框架整合,甚至在切換的時候都不需要刷新頁面(這個是demo,支持React, Vue, Angular 1, Angular 2, etc)。可以看Bret Little的介紹。
  2. 多個單一頁面應(yīng)用分管不同的URL。該方法使用了NPM/Bower來共享某些功能。
  3. 將微服務(wù)包裝到IFrames中,然后使用一些庫和Window.postMessageAPI來交互。
  4. 不同的模塊使用共享事件總線(比如,chrisdavies/eev)來交流。每一個模塊使用獨(dú)自開發(fā),并處理所有模塊間的交互事件。
  5. 使用Varnish Cache來整合不同的模塊。
  6. 使用Web Components來作為一個整合層整合所喲模塊。
本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
移動端開發(fā)者眼中的前端開發(fā)流程變遷與前后端分離
對前端、后端和全棧感興趣的人,建議都看看!18年老程序員給你指點(diǎn)迷津
2018前端工程師成長路線圖
實(shí)施前端微服務(wù)化的六七種方式
如何用Node中的Express應(yīng)用框架的技術(shù)選型?本文詳解
網(wǎng)站交互、開發(fā)方式和前端框架介紹
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服