关于常见的前端架构面试汇总题

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

猜你喜欢

转载自blog.csdn.net/liuyingv8/article/details/80901256