算法和手写编程题
算法：链表、栈和队列、二叉树
性能优化
web 性能优化？
降低请求量：合并资源，减少 HTTP 请求数，minify / gzip 压缩， webP，lazyLoad。
加快请求速度：预解析 DNS，减少域名数，并 行加载，CDN 分发。
缓存：HTTP 协议缓存请求，离线缓存 manifest，离线数据缓存 localStorage。
渲染：JS/CSS 优化，加载顺序，服务端渲染，pipeline
如何提高小程序的首屏加载时间？
提前请求：异步数据数据请求不需要等待页面渲染完成
利用缓存：利用 storage API 对异步请求数据进行缓存，二次启动时 先利用缓存数据渲染页面，再进行后台更新
避免白屏：先展示页面骨架和基础内容 及时反馈：及时地对需要用户等待的交互操作给出反馈，避免用户以 为小程序没有响应
性能优化：避免不当使用 setdata 和 onpagescroll
webpack相关
webpack 的打包原理
Webpack 是把项目当做一个整体，通过给定一个主文件，webpack 将从这个主文件开始找到项目中所有依赖的文件，使用 loaders 类处 理，最后打包成一个或者多个浏览器可识别的 js 文件
webpack 中的 loaders 与 plugin 的区别
什么是 loaders：loaders 是文件加载器，能够加载资源文件，并对 这些文件进行处理，例如，编译，压缩等，最终一起打包到指定文件 中。
什么是 plugin：在 webpack 运行的生命周期会有许多事件，plugin 可以监听这些事件 区别：加载器是用来加载文件的，webpack 本身只能加载 js 文件(内 置 babel-loader)，加载其他文件就需要安装别的 loader，比如： css-loader file-loader Plugin 是扩展 webpack 功能的，通过 plugin ，webpack 可以实 现 loader 不能完成的复杂功能
Webpack 与 gulp 区别
Gulp 是一种能够优化前端开发流程的工具
webpack 是一种模块化的解决方案 （grunt）
git高级操作
git checkout - 导航 —— 跳到之前的分支 查看历史 # 每个提交在一行内显示 git log --oneline # 在所有提交日志中搜索包含「homepage」的提交 git log --all --grep='homepage' # 获取某人的提交日志 git log --author="Maxence" 不想提交，又要回滚 git reset --hard <提交的哈希值> 查看我的分支和 master 的不同 git diff master..my-branch # 在最近 3 个提交上运行 `npm test` 命令 git rebase HEAD~3 --exec "npm test"
前端微服务
特点
- 独立部署
- 独立开发
- 技术无关
- 不影响用户体验
6种方式
路由分发式微前端
通过路由将不同的业务分发到不同的、独立前端应用上。其通常可以通过 HTTP 服务器的反向代理来实现，又或者是应用框架自带的路由来解决。
使用 iFrame 创建容器
iframe 可以创建一个全新的独立的宿主环境，这意味着我们的前端应用之间可以相互独立运行。采用 iframe 有几个重要的前提：
- 网站不需要 SEO 支持
- 需要设置加载机制
- 需要设置通讯机制
框架之上设计通讯、加载机制
不论是基于 Web Components 的 Angular，或者是 VirtualDOM 的 React 等，现有的前端框架都离不开基本的 HTML 元素 DOM。那么，我们只需要：
1. 在页面合适的地方引入或者创建 DOM
2. 用户操作时，加载对应的应用（触发应用的启动），并能卸载应用。
通过组合多个独立应用、组件来构建一个单体应用
常见的方式有：
- 独立构建组件和应用，生成 chunk 文件，构建后再归类生成的 chunk 文件。（这种方式更类似于微服务，但是成本更高）
- 开发时独立开发组件或应用，集成时合并组件和应用，最后生成单体的应用。
- 在运行时，加载应用的 Runtime，随后加载对应的应用代码和模板。
但是，首先它有一个严重的限制：必须使用同一个框架。
其次，采用这种方式还有一个限制，那就是：规范！**规范！**规范！。在采用这种方案时，我们需要： - 统一依赖。统一这些依赖的版本，引入新的依赖时都需要一一加入。
- 规范应用的组件及路由。避免不同的应用之间，因为这些组件名称发生冲突。
- 构建复杂。在有些方案里，我们需要修改构建系统，有些方案里则需要复杂的架构脚本。
- 共享通用代码。这显然是一个要经常面对的问题。
- 制定代码规范。
纯 Web Components 技术构建
Web Components 组件可以拥有自己独立的 Scripts 和 Styles，以及对应的用于单独部署组件的域名。然而它并没有想象中的那么美好，要直接使用纯 Web Components 来构建前端应用的难度有：
- 重写现有的前端应用。是的，现在我们需要完成使用 Web Components 来完成整个系统的功能。
- 上下游生态系统不完善。缺乏相应的一些第三方控件支持，这也是为什么 jQuery 相当流行的原因。需要设置通讯机制
- 系统架构复杂。当应用被拆分为一个又一个的组件时，组件间的通讯就成了一个特别大的麻烦。
- 浏览器兼容问题
现有框架（single-spa、qiankun、mooa）
其中single-spa已经实现了大部分框架（vue、react、angular）的启动和卸载处理，但不适用于生产环境
qiankun是基于spa-single实现的以运行在生产环境为目标的微前端服务框架
Mooa是一个仅仅基于angular框架的微前端框架
设计模式
简单工厂- 处理变与不变的
工厂模式：将创建对象的过程单独封装，实现无脑传参，核心：处理变与不变的
抽象工厂- 开放封闭原则
简单工厂因为没有遵守开放封闭原则， 暴露一个很大的缺陷。例如若我们添加管理层一些考评权限，难道我们要重新去修改Factory函数吗？这样做会导致Factory会变得异常庞大，而且很容易出bug，最后非常难维护
单例模式 - 保证一个类只有一个实例
保证一个类仅有一个实例，并提供一个访问它的全局访问点。单例模式要求不管我们尝试去创建多少次，它都只给你返回第一次所创建的那唯一的一个实例。
装饰器模式 - 实现只添加不修改
适配器模式 - 兼容就是一把梭
代理模式
事件代理：点击子元素，用父元素代理
缓存代理
观察者模式
