前端优化:
1.模块化
常见的模块化方案有:AMD、CMD、UMD、ES6
2.缓存
电商项目将常用数据缓存起来,比如,移动端首页的数据,商品分类等这些不经常变化的数据,目的是为了 增强 移动端Android、iOS 响应速度。
在controller 收到用户请求后判断 ehcache中有没有缓存这个数据,没有就加载这个资源(数据库或者文件中)然后丢到缓存中,
如果调用了这些数据的添加修改删除方法就删除这个缓存
3.图片懒加载
插件资源
https://github.com/zhanyouwei/m-lazy
4.js懒加载(按需加载)
插件:RequireJS、SeaJs
RequireJS AMD方案
5.前端模板渲染
原理:
重排和重绘(Layout环节和Painting环节)
任何改变dom元素位置的操作都会引发浏览器重绘操作,这是无法避免的
方案一
相比拼接字符串,jQuery.append
方案二
前端模板方案 比如,腾讯的tmodjs
6.dom操作
精确的控制dom元素(id 选择器)
7.
首屏数据服务端输出(服务端渲染),配上懒加载一起
针对已经前后端分离的项目,我建议可以尝试使用Node.js针对页面进行直出,也是一个不错的选择,
8.webp格式的图片
时刻提醒自己 We Are Developer 不要太局限自己了
时间: 2024-10-10 09:26:22