HTML与CSS
DOM操作与性能问题
- 页面需要渲染一万个dom元素,如何提升页面性能?
- 页面需要操作一万个dom元素,如何提升页面性能?
事件冒泡和事件委托
- 事件委托到父节点上或者documnet中,哪个更好?
虚拟DOM的设计
- 为什么要使用虚拟dom?
- 为什么要使用JavaScript对象来描述dom结构
- 简单描述下虚拟 DOM 的实现原理
页面布局原理
- 我们常说的盒模型是指什么
- 什么是文档流
- 移动端如何做页面适配
常见页面布局的技巧
- 元素居中布局的几种实现方式
- 对 Flex 布局、Grid 布局方式的理解和使用
浏览器的布局过程
- 浏览器在进行页面布局过程中会做些什么
- 重绘和重排会导致什么问题
- CSS 动画和 javascript 动画相比,有什么优缺点
Javascript
Javascript 的原型和继承
- 如何理解 Javascript 中的一切皆对象
- 如何创建一个对象
- proto 与 prototype 的区别
- js常见问题
对单线程 Javascript 的理解
- 单线程来源
- Web Workers 和 Service Workers 的理解
异步事件机制
- 为什么使用异步事件机制
- 在实际使用中异步事件可能会导致什么问题
- 关于 settimeout、setinterval 的时间精确性
作用域与闭包
- 请描述以下代码的执行输出内容(考察作用域)
- 什么场景需要使用闭包
- 闭包的缺陷
this 与执行上下文
- 简单描述 this 在不同场景下的指向
- apply/call/bind的使用
- 箭头函数与普通函数的区别
对 Eventloop 的理解的区别
- 介绍浏览器的 Eventloop
- 宏任务(Macrotask)和微任务(Microtask)
- settimeout、Promise、async/ await 在不同浏览器的执行顺序
ES6/ES7相关的语法
- 手写代码实现 Promise
- 为什么要使用 async、 await
- 怎样让ES6/ES7代码可以跑在各个浏览器中(考察 Babel 与 polyfil)
- 介绍下 Set 和 Map 数据结构
- Javascript 是怎么实现 let 和 const 作用域的
浏览器相关
浏览器的同源策路
- 同源指什么
- 哪些行为受到同源策略的限制
- 常见的跨域方案有哪些
浏览器的缓存相关
- Web 缓存通常包括哪些
- 浏览器什么情况下会使用本地缓存
- 强缓存和协商缓存的区别
- 强制 ctr+F5 刷新会发生什么
- session、cookie、token 以及 storage 的区别
浏览器加载顺序
- 为什么我们通常将 Javascript 放在< body >的最后面
- 为什么我们将 CSS 放在< head> 里
浏览器的渲染原理
- HTML/CSSS 的解析过程
- 渲染树是怎样生成的
- 重排和重绘是怎样的过程
- 日常开发中要注意哪些渲染性能问题
浏览器事件
- 浏览器中包括哪些事件
- 在浏览器中,是如何处理用户的交互的
- 对事件进行监听的回调函数,会在什么被执行
网络相关
一个完整的HTTP请求过程
- 域名解析(此处涉及 DNS 的寻址过程)
- TCP 连接建立
- TCP 的 3 次握手过程及 4 次挥手过程
- 为什么 TCP 连接握手需要 3 次通信,挥手却需要 4次
- 建立 TCP 连接后发起 HTTP 请求
- 服务器响应 HTTP 请求
HTTP协议相关
- HTTP 消息的结构
- www.twle.cn/l/yufei/htt…
- Request 请求
- Response 响应
- 常见的 HTP 状态码
- HTTP 请求方法
- 使用 PUT、DELETES 等方法时为什么有时候在浏览器会看到两次请求(涉及 CROS 中的简单请求和复杂请求)
- juejin.cn/post/684490…
- HTTP 请求的应用场景
- 浏览器是如何控制缓存的:相应的头信息、状态码
- Websocket 与 HTTP 请求的区别
- 如何对请求进行抓包和改造
- 网络请求的优化方法
- HTTP的更新迭代
- HTTPS 与 HTTP的区别
- HTTP/2、HTTP/3 分别做了怎样的设计调整
Node.js
Node.js 模块与 API
- Node.js有哪些定时功能
- Process.nextTick 和 setlmmediate 的区别
- Node.js中的异步和同步怎么理解,异步流程如何控制
- 简单介绍一下 Node.js 中的核心内置类库(事件,流,文件,网络等)
用作服务端的 Node.js
- Node.js有哪些特点,单线程的优势和缺点是什么
- 如何用 Node.js 来监听 80 端口
- express 是如何从一个中间件执行到下一个中间件的
- Rest ApI 有使用过吗,介绍一下
- express、koa、egg 之间的区别
安全相关
前端安全
- 前端安全中,需要注意的有哪些问题
- XSS/CSRF是怎样的攻击过程,要怎么防范
- 除了 XSS 和 CSRF,你还了解哪些网络安全相关的问题呢
其他web安全
- SQL 注入、命令行注入是怎样进行的
- DDos 攻击是什么
- 流量劫持包括哪些内容
算法与数据结构
算法相关
- 各种排序算法、稳定排序与原地排序、 Javascript 中的 sort 使用的是什么排序
- 查找算法(顺序、二分查找)
- 递归、分治的理解和应用
- 动态规划
常见的数据结构
- 链表与数组
- 栈与队列
- 二叉树、平衡树、红黑树等
计算机通用知识
计算机资源
- 理解计算机资源,认识进程与线程(单线程、单进程、多线程、多进程)
- 进程间通信(IPC)常包括哪些方式,进程间同步机制又包括哪些方式
- 了解阻塞与非阻塞、同步与异步任务等
- Socket 与网络进程通信是怎样的关系、Socket 连接过程是怎样的
编程与设计模式
- 常见的设计模式有哪些
- 列举实际使用过的一些设计模式
- 如何理解面向对象编程
- 对函数式编程的看法
前端框架与工具库
前端框架
- Vue 中的双向绑定是怎么实现的
- 谈谈你对前端常见的框架(Angular/ React/ vue)的理解,它们之间有哪些区别
- 该项目使用 Angular/ React/Vue的原因是,如果现在你重新决策,你会使用什么框架
- 你有了解过这些框架都做了哪些事情,介绍一下是怎么实现的
其它前端工具库
- 应用状态管理有哪些方案,Vuex/ Redux/Mobx 等工具是怎样进行状态管理的
- 单页应用是什么?如何进行 SEO 优化
- 有实际使用过哪些第三方库
- 这些工具库有什么特性和优缺点
小程序相关
- 小程序和 H5 有什么不ー样,为什么选小程序而不是 H5
- 有考虑在小程序里嵌 H5 实现吗,为什么
- 为什么小程序的性能要好一些
- 小程序开发有用到哪些框架吗、为什么
Node.js 与 服务端
技术选型
- 为什么要用 Node.Js(而不是 PHP/JAVA/GO/ C+等), Node.Js 适用于怎样的场景
- 如果作为服务端的接入层,Node.js 对比其他多线程和协程语言有什么优劣势吗
- Restful 和 Graphql 的关系和区别
应用场景
- 如何解决高并发问题(春节红包、零点抢购等场景)
- 如果作为中间件服务,Node.js 有哪些要注意的地方
性能优化
前端通用性能优化
- 有做过性能优化相关的项目吗,具体的优化过程是怎样的/优化效果是怎样的
- 常见的前端页面性能优化包括哪些内容
- 如何理解项目的性能瓶颈/什么时候我们需要对一个项目进行优化
具体的性能优化方案
- 图片加载性能有哪些可以优化的地方
- 要怎么做好代码分割、降低代码包大小可以有哪些方式
- 首屏页面加載很慢,要怎么优化
- 网络请求耗时较多,怎么进行定位和优化
- 页面有没有做什么柔性降级的处理
项目角度性能优化
www.alloyteam.com/2019/10/h5-…
- 首屏性能提速
- 按需加载/懒加载预加载
- 秒看
- SSR 直出
- 客户端容器化
- 客户端离线化
- 网络请求优化
- CDN 优化
- 缓存优化
- 使用 HTTP/2
- 资源压缩(Gzip)
- 请求优化(合并请求、域名拆分、减少 DNS 查旬时间)
前端工程化
构建工具和脚手架
前端模块化
- 为什么我们开发的时候要使用脚手架
- 如何理解模块化,Commonjs/AMD/UMD/ES6 模块之间的区别是什么
- 为什么要使用 Webpack,它和 Gulp、Rollup 有什么不一样
Webpack
- 讲一下 Webpack 中常用的一些配置、Loader、插件
- Babel 的作用是什么,如何选择合适的 Babel 版本
- Webpack 是怎么将多个文件打包成一个,依赖问题如何解决
- 有写过 Webpack 插件吗,Webpack 编译的过程具体是怎样的
代码编译和构建
- CSS 文件打包过程中,如何避兔 CSS 全局污染
- 本地开发和代码打包的流程分别是怎样的
- Tree Shaking 是怎样一个过程
自动化/流程化实践
持续集成 CI 和持续部署 CD
- 怎么理解持续集成CI/CD,它们能解決什么问题
- 你们的项目有使用CI/CD 吗,为什么
自动化流程
- 你们的代码有写单元测试自动化测试吗,为什么
- 前端代码支持自动化发布吗,如何做到的
- 生产环境的代码如何支持灰度发布和快速回滚自动化流程
- 在搭建自动化、流程化的过程需要投入不少人力,在业务进度同样吃力的场景下,怎么平衡人力投入问题
多人协作规范
代码规范
- 怎么强制进行 Code Review
- 有遇到代码习惯差异的问题吗,如何解决
- 有哪些常用的代码校验的工具
- 代码有使用 Elint、prettier 这些工具吗,谈谈对这些工具的看法
开发流程
- 多人开发过程中,代码冲突如何解决
- 项目中有使用 Git 吗?介绍一下 Git flow 流程开发流程
- 如果项目频繁交接,如何提升开发效率
开发效率提升
- 做了很多的管理端 H5, 有考虑过怎么提升开发效率吗
- 你的项目里,有没有哪些工作是可以用工具完成
- 项目中有进行组件和公共库的封装吗
- 如何管理这些公共组件/工具的兼容问题
- 日常工作中,如何提升自己的工作效率
前端监控相关
数据上报
- 发生异常,要怎么快速地定位到具体位置
- 业界常见的埋点方案包括哪些
- 页面数据如何进行合理的上报,而不影响核心功能
实时监控
-
日常开发过程中,怎么保证页面质量
-
版本发布有进行灰度吗?灰度的过程是怎样的
-
版本发布过程中,如何及时地发现问题,需要关注哪些数据
-
如何观察线上代码的运行质量