• 前端开发
  • 传统的web开发
    • 管理端、H5/小程序、可视化、游戏等
  • Node.js开发
    • 服务端接入层、构建工具、云服务等
  • 终端开发
    • react native 、 flutter 、 electron等项目

开发过程中涉及的系统涉及、方案调研、技术选型、性能优化、效能提升这些都是想通的

这是怎样的一个项目？他遇到什么问题、存在着怎样的瓶颈？又需要怎么去解决？

前端面试相关知识点

• 前端常见的框架和工具库
  • 重要的是要知道各个框架的区别、掌握框架设计和实现原理
• Node.js和服务端
  • 和API相关，而在使用Node.js作为服务端的项目中，面试官更倾向于考察相关的方案选型和设计
• 前端性能优化
  • 性能优化永远是开发者们的重要任务，和用户交互最密切的前端性能更是会影响用户去留的因素
• 开发效率提升
• 前端监控搭建
• 前端工程化
  • 指使用工具自动化的完成一些以前需要开发手动解决的任务，一般来说涉及各式各样的构建/打包工具、脚手架、CI/CO和流水线的搭建、代码部署及灰度房补等过程的自动化

前端框架

• 前端框架
  • vue中的双向绑定是怎么实现的？
  • 介绍下angular中的依赖注入
  • 讲讲react的资源调度设计
  • 讲讲对react hooks的理解，它的优缺点（useEffect的使用和上下文、setTimeout）
  • 谈谈你对前端常见的框架（angular、react、vue）的理解，他们之间有哪些区别
  • 该项目使用angular、react、vue的原因是什么
  • 如果现在你重新决策，你会使用什么框架
  • 你是否有了解过这些框架都做了哪些事情，介绍一下是怎么实现的
• 其他前端工具库
  • 应用状态管理有哪些方案，mobx、redux、vuex等工具是怎样进行状态管理的
  • 单页应用是什么？如何进行seo优化？
  • 你实际使用过哪些第三方库？
  • 这些工具库有什么特性和优缺点？
• 小程序相关
  • 小程序和H5有什么不一样，为什么选小程序而不是H5？
  • 有考虑在小程序里嵌用H5实现吗，为什么？
  • 为什么小程序的性能要好一些
  • 小程序开发有用到哪些框架？为什么

node.js方案选型和设计（更偏向后台内容）

• 技术选型
  • 为什么要用node.js（而不是php/java/go/c++等），node.js适用于怎样的场景？
  • 如果作为服务端的接入层，node.js对比其他多项城的协诚语言有什么优劣势？
  • restful和graphql的关系和区别？
• 应用场景
  • 如何解决高并发问题（春节红包、零点抢购等场景）
  • 如果作为中间件服务，node.js有哪些要注意的地方？

如果想要成为真正的全栈，不妨从最基础的计算机原理、编译原理、数据库设计等开始学起

Node.js与服务端

前端：对于单线程的web、浏览器机制、动态语言的缺陷和有事

Http协议、网络请求等掌握的很熟练

深入发展方向：包括大型页面的性能优化、页面功能模块的抽象与组织、数据与渲染的拆离、前端工程化的规范化与效率提升等

后台：本身更关注计算机资源、多进程、数据库等，需要熟练掌握高并发、队列、进程通信、十五、数据库索引等

性能问题

• 空间性能问题：为内存占用、cpu占用、本地缓存占用过多带来的问题
• 时间性能问题：用户等待时间过长，包括页面加载，渲染，可交互等耗时

前端性能优化

• 前端通用性能优化
  • 页面有没有做什么柔性降级处理
  • 有做过性能优化相关的项目吗？具体的优化过程是怎样的/优化效果是怎样的
  • 常见的前端页面性能优化包括哪些内容
  • 如何理解项目的性能瓶颈/什么时候我们需要对一个项目进行优化
• 具体的性能优化方案
  • 图片加载性能有哪些可以优化的地方
  • 要怎么做好代码分割、降低代码包大小可以有哪些方式
  • 首屏页面加载很慢，要怎么优化
  • 网络请求耗时较长，怎么进行定位和优化

以某个项目为出发点，从页面启动，请求资源，到解析数据，渲染页面，分析各个过程中哪些阶段耗时较大，然后针对性的进行优化

针对性优化方案

• 首屏性能提速
  • 按需加载/懒加载/预加载
  • 秒看
  • ssr直出
  • 客户端容器化
  • 客户端离线化等
• 网络请求优化
  • CDN优化
  • 缓存优化
  • 使用HTTP/2
  • 资源压缩
  • 请求优化（合并请求、域名拆分、减少DNS查询时间）等

前端工程化

• 前端模块化
  • 为什么我们开发的时候要使用脚手架？
  • 如何理解模块化，commonjs/amd/umd/es6模块之间的区别是什么？
  • 为什么要使用webpack，他和Gulp、Rollup有什么不一样？
• webpack
  • 讲一下webpack中常用的一些配置、Loader、插件？
  • Babel的作用是什么，如何选择合适的Babel版本？
  • webpack是怎么将多个文件打包成一个，依赖问题如何解决
  • 有写过webpack插件吗，webpack编译的过程具体是怎样的
• 代码编译和构建
  • css文件打包过程中，如何避免css全局污染
  • 本地开发和代码打包的流程分别是怎样的
  • Tree Shaking是怎样的一个过程
• 持续集成（continuous integration 简称CI），持续部署（continuous deployment，简称CD）
  • 怎么理解持续集成CI/CD，他们能解决什么问题？
  • 你们的项目有使用CI/CD？为什么
• 自动化流程
  • 你们的代码有些单元测试/自动化测试吗，为什么？
  • 前端代码支持自动化发布吗，如何做到的
  • 生产环境的代码如何支持灰度发布和快速回滚？
  • 在搭建自动化、流程化的过程需要投入不少人力，在业务进度统一吃力的场景下，怎么平衡人力投入问题
• 代码规范
  • 怎么强制进行 code review
  • 有遇到代码习惯差异的问题吗，如何解决
  • 有哪些常用的代码校验工具
  • 代码有使用eslint、prettier这些工具吗，谈谈对这些工具的看法
• 开发流程
  • 多人开发过程中，代码冲突如何解决？
  • 项目中有使用git吗。介绍一下git flow流程
  • 如果项目频繁交接，如何提升开发效率

前端监控（坚决问题点：如何及时发现问题，如何快速定位并解决问题）

涉及页面的整体访问情况、页面的性能情况、用户问题反馈、监控和告警能力等

• 数据上报
  • 发生异常，要怎么快速定位到具体位置
  • 业界常见的埋点方案包括哪些
  • 页面数据如何进行合理的上报，而不影响核心功能
• 实时监控
  • 日常开发过程中，怎么保证页面质量
  • 版本发布有进行灰度吗？灰度的过程是怎样的
  • 版本发布过程中，如何及时的发现问题，需要关注哪些数据
  • 如何观察线上代码的运行质量

以实战来学习java，希望每个从我这边都有收获，有需要的同学加扣扣群：646410846，一起学习，共同进步~