juejin.cn![[憨笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_27.0006230.png)
获得徽章 12
- 发布半年后，又加更了一节《 手把手带你学会前端优化神器《Grafana》视频+图文教程》：
juejin.cn
目标是解决大家在Grafana Agent Alloy安装过程中遇到的报错、数据未上报等问题，
使用了新版的 Grafana Alloy 作为演示，并且会追加配套的视频教程。
欢迎各位来试一试，更欢迎评论、点赞、转发支持一下![[憨笑]](//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_27.0006230.png)
展开126 - 《前端工程体验优化》(juejin.cn)全书现已发布到掘金小册，欢迎各位朋友一起交流学习
1. 你做的前端优化都错了-数据驱动、指标先行
2. 前端优化数据量化必备神器-用户体验数据收集与可视化
3. 光速入门Performance API
4. 2行代码让JS加载耗时减少67%-资源优先级提示
5. CDN最佳实践：让CDN流量节省10%
6. CDN最佳实践：验证，量化与评估
7. 超简单的代码模块懒加载：让JS加载体积减少13%
8. 超简单的代码模块懒加载：懒加载常见问题解决方案
9. 代码分割最佳实践：细粒度代码分割(Granular Code Split)
10. 代码分割最佳实践：应用改造示例
11. 前端渲染进化史：用SSR让首次内容绘制耗时（FCP）降低72%
12. 前端渲染进化史：SSR进阶优化
13. 图片加载体积减少20%-自适应选择最优图片格式
14. GIF体积减少80%-GIF图片优化
15. 万物皆可懒加载-3类通用资源懒加载实现方案
16. CLS 和 LCP 专项优化
17. 打包耗时减少43%-现代构建工具的魔力
18. 重构CSS-用CSS In JS解决CSS的诸多痛点
19. 打造技术改进文化-征求意见稿制度RFC
20. 一错不再错-用自动化测试避免功能衰退展开评论6 - 热火朝天更新中，欢迎点赞评论催更
![[碰拳]](//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_114.4b8db8b.png)
《前端优化实战——现代前端工程体验优化》目录
第一章、数据驱动，指标先行
第一节：《数据驱动，监控先行》
第二节：《用户体验数据收集与可视化：基于 Prometheus 及 Grafana 的实现简介》
第二章、用户体验优化
第一节：《强大的资源优先级提示》
第三章、开发体验优化
第四章、制度建设
第五章、持续集成：用自动化工具保持优化效果
展开12 - 32
![[碰拳]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_114.4b8db8b.png)