个人博客 >> https://www.alienzhou.com/

不定期发布一些技术学习的收获，主要聚焦于大前端领域，也会有一些其他内容。欢迎star 🌟

目录

1. 最新更新
2. 综合列表
3. 开源项目学习
4. 自动化工具
5. CSS 学习
6. 性能
7. Webpack进阶
8. CSS模块化
9. PWA
10. 知识速览
11. 阅读笔记
12. 排障系列
13. Node.js

1. 最新更新

• MCP 是最大骗局？Skills 才是救星？（2026.01.13）
• 从"鸡肋"到"真香"：语音输入在我 Vibe Coding 这件事上的反转（2025.12.31）

2. 综合列表

• 年终回顾，为你汇总一份「前端技术清单」
• ✨如何实现一个通用的“划词高亮”在线笔记功能？✨🖍️
• 前端跨页面通信，你知道哪些方法？
• MongoDB高可用__使用Replica Set
• 各类“服务器推”技术原理与实例（Polling/COMET/SSE/WebSocket）
• 如何在零JS代码情况下实现一个实时聊天功能❓

3. 开源项目学习

• 【漫游Github】quicklink：实现原理与给前端的启发
• 【漫游Github】如何提升JSON.stringify()的性能？
• 【漫游Github】无编译/无服务器，实现浏览器的 CommonJS 模块化

4. 自动化工具

• vue-cli 迁移 vite2 实践小结
• 替代 webpack？带你了解 snowpack 原理
• Gulp.js实践详解__基于Gulp的多页面应用实践指南
• 🛠如何快速开发一个自己的项目脚手架？

5. CSS 学习

• 一篇全面的CSS布局学习指南 [译]
• (S)CSS中实现主题样式的4½种方式 [译]

6. 性能

• 【性能优化指南】带你全面掌握前端性能优化 🚀
• 【性能优化实践】优化打包策略提升页面加载速度

7. Webpack进阶

• 聊一聊 webpack 的打包优化实践
• 【webpack进阶】使用babel避免webpack编译运行时模块依赖
• 【webpack进阶】前端运行时的模块化设计与实现
• 【webpack进阶】可视化展示webpack内部插件与钩子关系📈
• 【webpack进阶】你真的掌握了loader么？- loader十问

8. CSS模块化

• 【CSS模块化之路1】使用BEM与命名空间来规范CSS
• 【CSS模块化之路2】webpack中的Local Scope
• 【CSS模块化之路3】 使用💅styled-components来进行react开发

9. PWA

• 【PWA学习与实践】(1) 2018，开始你的PWA学习之旅
• 【PWA学习与实践】(2) 使用Manifest，让你的WebApp更“Native”
• 【PWA学习与实践】(3) 让你的WebApp离线可用
• 【PWA学习与实践】(4) 解决FireBase login验证失败问题
• 【PWA学习与实践】(5)在Web中进行服务端消息推送
• 【PWA学习与实践】(6) 在Chrome中调试你的PWA
• 【PWA学习与实践】(7)使用Notification API来进行消息提醒
• 【PWA学习与实践】(8)使用Service Worker进行后台同步 - Background Sync
• 【PWA学习与实践】(9)生产环境中PWA实践的问题与解决方案
• 【PWA学习与实践】(10)使用Resource Hint提升页面加载性能与体验

10. 知识速览

• 【3分钟速览】前端广播式通信：Broadcast Channel
• 【3分钟速览】如何“严谨地”判断两个变量是否相同

11. 阅读笔记

• 读《凤凰项目：一个 IT 运维的传奇故事》
• 读《信息规则：网络经济的策略指导》

12. 排障系列

• DNS 查询导致的 Nodejs 服务疑似“内存泄漏”问题
• npm script 执行”丢失“ root 权限的问题
• 记一次 Node gRPC 静态生成文件引发的问题
• Node.js 中 HTTP 请求结束后，误报超时的问题排查

13. Node.js

• Nodejs 中的 Active Handle 与 Timer 优化（上）
• Nodejs 中的 Active Handle 与 Timer 优化（下）
• Node.js 中 HTTP 请求结束后，误报超时的问题排查