前端架构分析
前端的价值到底在哪里
- 实现界面交互
- 提升用户体验
总结就是能写交互页面，写的交互页面用户用的爽
前端的进阶
前端不局限于前端【当然优先前端技术需要如何进阶】
性能优化
推荐阅读掘金文章《移动web性能优化从入门到进阶》
- 首先是如何发现问题。
- 发现问题之后，是如何分析其中原因
- 找到原因之后，采用的解决办法。
- 解决之后，是否真实的对用户体验有所提升。
对框架的理解
流行框架的API调用是最基本的要求，理解框架原理，理解思想可以让你在前端的路上走的更远，以vue为例
- Vue中的双向绑定，只是简单的
Object.defineProperty()么？ - vue3的proxy方式和vue2的方式区别在哪？
- Vue的数据依赖是如何实现的？
- Vue的computed和watch到底有何本质区别？
- keep-alive的实现原理？
深入Node.js
此处node不是单独指后端逻辑的开发。目前前端工程化体系中，扮演重要角色的webpack，parcel，vue-cli等等，或者是现在让JavaScript能够开发PC桌面程序的Electron等都是需要掌握的一部分
- 与浏览器端的JavaScript不同，Node.js后端是直面服务器的，如何定位和分析内存泄漏问题
- 尝试写一些webpack插件。
Canvas与WebGL
首先WebGL是基于OpenGL的Web3D图形规范，是一套JavaScript的API。使用WebGL相关的3D处理技术和算法，并不需要掌握复杂的算法或者数学知识，只需要学会three.js就可以完成前端3D的一些业务需求
- 实现一个刮刮卡或者涂鸦墙的业务需求
- 图片上传时进行压缩和裁剪。
- 在实现帧动画方面，使用CSS3和Canvas的选择。
可以就以上场景来对WebGL 以及canvas 进行一个深入学习了解
架构
以上只是进阶架构的基础掌握，掌握前端技术的同时，你还要学了解前端技术之外的技能。跳出前端这个思维，才能看到的更多。
跨界
页面的秒开是衡量一个前端优化的重要指标，我们以这个优化点来总结一下从哪些方面跨：
- 提升速度，从服务端渲染着手，可以利用Node.js往后端跨。
- 提升移动web的H5页面的启动耗时，从webview着手，利用iOS和Android技能往客户端跨
用户交互操作体验，也是衡量前端优化的重要指标，我们以这个优化点来总结一下从哪些方面跨：
- 提升用户交互体验，尝试将web页面客户端化，基于React Native Flutter uniapp也可以往客户端跨。
- 提升页面动画效果，编写高性能的前端动画，也可以往UI动效设计跨。
工具和平台化建设
工具平台主要就是围绕我们的研发流程中的每一步关键节点去建设
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-K2AEFeEC-34)(C:\Users\野王新之助\AppData\Roaming\Typora\typora-user-images\image-.png)]
流程和规范化
对流程的制定和规范，是非常重要的。不要小瞧规范的威力，可以极大的提升开发效率，真正优秀的规范不会让使用者感到约束，而是能帮助他们快速定位问题，提升效率。
- 结构的规范：对项目的代码结构，不管前后端，合理的分层和组件化是非常必要的。
- 编码的规范：这里主要就是代码codereview了，定期的进行codeview的同时，最好可以使用一些自动化工具
- 流程的规范：项目的评审，研发，测试，发布这些阶段都需要有流程来约束，这些需要结合自身团队的实际情况来制定。
- 规范的落地：对于规范来说最关键的是执行落地，在制定完规范的同时，要不时的回顾是否切实的落地，这个应该是团队里每个成员坚持的基本准则。
安全意识
- 低级的的代码安全问题，要坚决说不，例如前端里面的xss，csrf这些问题。
- 对大型运营类活动需求，要有容灾意识和备份，例如在准备了一套方案的同时，要有可选的备用方案。
- 尝试使用工具化来解决和预防安全问题，例如BAT这种大型企业，在运维和代码层面，都有一层保障机制，如腾讯的门神系统等。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/226076.html原文链接：https://javaforall.net
