前端架構試題

架構

1、 若是讓你來製做一個訪問量很高的大型網站，你會如何來管理全部css、js文件、圖片？

(1)   遵循自定的一套CSS，JS和圖片文件和文件夾命名規範

(2)   依託採用的前端工程化工具，依照工具腳手架規範（gulp, webpack, grunt, yeoman)

(3)   依據採用的框架規範（Vue, React, jQuery)

2、 若是沒有框架、怎麼搭建你的項目

應用原生JS本身嘗試搭建一個MVC架構：

(1)基本模塊

common:公共的一組件，下面的各模塊都會用到

config:配置模塊，解決框架的配置問題

startup:啓動模塊，解決框架和Servlet如何進行整合的問題

plugin:插件模塊，插件機制的實現，提供IPlugin的抽象實現

routing:路由模塊，解決請求路徑的解析問題，提供了 IRoute的抽象實現和基本實現

controller:控制器模塊，解決的是如何產生控制器

model:視圖模型模塊，解決的是如何綁定方法的參數

action: action模塊，解決的是如何調用方法以及方法返回的結果，提供了IActionResult的 抽象實現和基本實現

view:視圖模塊，解決的是各類視圖引擎和框架的適配

filter:過濾器模塊，解決是執行Action,返回IActionResult先後的AOP功能，提供了 IFilter 的抽象實現以及基本實現

擴展模塊filters：一些IFilter 的實現

results :―些IActionResult 的實現

routes :―些IRoute 的實現

plugins:—些 IPlugin 的實現

 

 

 

3、 在選擇框架的時候要從哪方面入手

影響團隊技術選型有不少因素，如技術組成，新技術，新框架，語言及發佈等。爲了更好的 考量不一樣的因素，須要列出重要的象限，如開發效率、團隊喜愛，依次來決定哪一個框架更適 合當前的團隊和項目。上線時間影響框架選擇，不要盲目替換現有框架。

(1)   jQuery

項目功能比較簡單。並不須要作成一個單頁面應用，就不須要MV*框架。項目是一個遺留 系統。與其使用其餘框架來替換，不如留着之後重寫項目。

(2)   AngularJS

當咱們在製做一個應用，它對性能要求不是很高的時候，那麼咱們應該選擇開發速度更快的 技術棧AngularJS，她擁有混合開發能力的ionic框架。對於複雜的前端應用來講，基於 Angular.js應用的運行效率，仍然有大量地改進空間。Angular2須要學習新的語言，需慎重 選擇。

(3)   React

選擇React有兩個緣由，一是經過Virtual DOM提升運行效率，二是經過組件化提升開發效 率。大型項目首選。選擇React還有_個緣由是：React Native、React VR等等，可讓 React運行在不一樣的平臺之上。咱們還能經過React輕鬆編寫出原生應用，還有VR應用。

使人遺憾的是React只是一個View層，它是爲了優化DOM的操做而誕生的。爲了完成一 個完整的應用，咱們還須要路由庫、執行單向流庫、web AP丨調用庫、測試庫、依賴管理庫 等等，爲了完整搭建出一個完整的React項目，咱們還須要作大量的額外工做。

(4)   Vue.js

對於使用Vue.js的開發者來講，咱們仍然可使用熟悉的HTML和CSS來編寫代碼。並 且，Vue.js也使用了 Virtual D〇M、Reactive及組件化的思想，可讓咱們集中精力於編寫 應用，而不是應用的性能。

對於沒有Angular和React經驗的團隊，而且規模不大的前端項目來講，Vue.js是一個很是 好的選擇。

詳細參見：https://zhuanlan.zhihu.com/p/25194137

4、 聊一聊前端模板與渲染

(1)   頁面級的渲染，後端模板

如smarty，這種方式的特色是展現數據快，直接後端拼裝好數據與模板，展示到用戶面前， 對SEO友好。

(2)   異步的請求與新增模板，前端模板

如Mustache, ArtTemplate,前端解析模板的引擎的語法，與後端解析模板引擎語法一致。 這樣就達到了一份HTML先後端一塊兒使用的效果。

詳細參見：http://www.javashuo.com/article/p-mfnsewxr-kp.html