1. 程式人生 > >關於常見的前端架構面試彙總題

關於常見的前端架構面試彙總題

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的抽象實現以及基本實現

(2)擴充套件模組

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 API 呼叫庫、測試庫、依賴管理庫等等,為了完整搭建出一個完整的 React 專案,我們還需要做大量的額外工作。

(4)Vue.js

對於使用 Vue.js 的開發者來說,我們仍然可以使用 熟悉的 HTML 和 CSS 來編寫程式碼。並且,Vue.js 也使用了 Virtual DOM、Reactive 及元件化的思想,可以讓我們集中精力於編寫應用,而不是應用的效能。

對於沒有 Angular 和 React 經驗的團隊,並且規模不大的前端專案來說,Vue.js 是一個非常好的選擇。

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

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

如smarty,這種方式的特點是展示資料快,直接後端拼裝好資料與模板,展現到使用者面前,對SEO友好。

(2)非同步的請求與新增模板,前端模板

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

來源:千鋒HTML5