每日一题系列

React 错误监听 题目 如何统一监听 React 组件报错？ 分析 真实项目需要闭环，即考虑各个方面，除了基本的功能外，还要考虑性能优化、报错、统计等。 而个人项目、课程项目一般以实现功能为主，不

Vue 错误监听 题目 如何统一监听 Vue 组件报错？ 分析 真实项目需要闭环，即考虑各个方面，除了基本的功能外，还要考虑性能优化、报错、统计等。 而个人项目一般以实现功能为主，不会考虑这么全面。所

React 优化 题目 你在实际工作中，做过哪些 React 优化？ 前端通用的优化策略 压缩资源，拆包，使用 CDN ，http 缓存等。本节只讨论首屏，这些先不讲。 循环使用 key key 可以

Vue 优化 题目 你在实际工作中，做过哪些 Vue 优化？ 前端通用的优化策略 压缩资源，拆包，使用 CDN ，http 缓存等。本节只讨论首屏，这些先不讲。 v-if 和 v-show 区别 v-

设计模式 题目 前端常用的设计模式？什么场景？ 开放封闭原则 设计原则是设计模式的基础，开放封闭原则是最重要的：对扩展开发，对修改封闭。 工厂模式 用一个工厂函数，创建一个实例，封装创建的过程。 应用

文字超出省略 注：文本小节 题目 文字超出省略，用哪个 CSS 样式？ 分析 如果你有实际工作经验，实际项目有各种角色参与。页面需要 UI 设计，开发完还需要 UI 评审。 UI 设计师可能是这个世界

渲染 10w 条数据 题目 后端返回 10w 条数据，该如何渲染？ 设计是否合理？ 前端很少会有一次性渲染 10w 条数据的需求，而且如果直接渲染会非常卡顿。 你可以反问面试官：这是什么应用场景。然后

首屏优化 题目 H5 如何进行首屏优化？尽量说全 前端通用的优化策略 压缩资源，使用 CDN ，http 缓存等。本节只讨论首屏，这些先不讲。 路由懒加载 如果是 SPA ，优先保证首页加载。 服务端

koa2 洋葱圈模型 题目 请描述 Koa2 的洋葱圈模型 解释 代码参考 Koa2 官网 图示..................................

网页多标签页之间的通讯 题目 网络多标签之间如何通讯？ 例如打开两个 chrome 标签，一个访问列表页，一个访问详情页。在详情页修改了标题，列表页也要同步过来。 webSocket 通过 webSo

输入 url 到页面展示 题目 从输入 url 到显示页面的完整过程 特别注意 现在浏览器经过多年发展和优化，加载和渲染机制已经非常复杂，我们只能讲解基本的流程。不可较真细节。 步骤 网络请求 解析

webSocket 题目 webSocket 和 http 协议有何区别？有和应用场景？ webSocket 简介 webSocket 和 http 都是应用层，支持端对端的通讯。可以由服务端发起，也

前端攻击 题目 你所了解的前端攻击手段有哪些，该如何预防？ XSS Cross Site Scripting 跨站脚本攻击 用户通过某种方式（如输入框、文本编辑器）输入一些内容，其中带有攻击代码（JS

defer 和 async 题目 <script> 的 defer 和 async 属性有何区别 答案 <script src="xxx.js"> 当解析到该标签时，会暂停 html 解析，并触发 j

https 中间人攻击 题目 什么是 https 中间人攻击，如何预防？ 复习：https 加密原理 http 是明文传输，传输的所有内容（如登录的用户名和密码），都会被中间的代理商（无论合法还是非法

cookie 和 token 区别 题目 cookie 和 token 有何区别 cookie http 请求是无状态的，即每次请求之后都会断开链接。 所以，每次请求时，都可以携带一段信息发送到服务端

Cookie的作用域仅仅由domain和path决定，与协议和端口无关。 相同域名不同端口的两个应用，cookie名字、路径都相同的情况下，后面cookie会覆盖前面的cookie。 结论：根据同源策

https://zhuanlan.zhihu.com/p/162373853 1px 宽度 题目 Retina 屏 1px 像素问题，如何实现 介绍 该问题通常用于考察你是否做过移动端 h5 项目。

移动端 click 300ms 延迟 题目 移动端 click 300ms 延迟，如何解决 背景 智能手机开始流行的前期，浏览器可以点击缩放（double tap to zoom）网页。这样在手机上就

Vue-router 模式 题目 Vue-router 模式 'hash' | 'history' | 'abstract' 的区别 v4 的升级 Vue-router v4 升级之后，mode: '