7篇 · 从源码到运行环境全链路 · SVG可视化 · 让"半生不熟"变成"彻底搞懂"
📦 共7篇 · 前端打包/Vue到浏览器/React到浏览器/Java到JVM/Maven/Docker/CI-CD
你写的代码怎么从源文件变成最终跑起来的程序?这三个页面一条线串到底——源码长什么样→编译器做了什么→打包成什么→在哪运行→怎么调试。
.vue三段式结构→Vue Compiler编译成render函数→Vite打包成chunk→浏览器F12的每个面板看什么→SourceMap原理→scoped的data-v属性是怎么加的
JSX到底是什么→Babel编译成createElement/jsx()→Webpack/Vite打包→React Fiber两阶段渲染(可中断)→F12和React DevTools→和Vue的编译优化对比
.java→javac编译成.class字节码→Maven打包fat jar→jar内部结构(BOOT-INF)→JVM类加载5步→Spring Boot启动7步(从main到能接收请求)→对比前端构建的核心区别
Webpack打包6步流水线(Entry→Resolver→Loader→Plugin→Chunk→Output)+ Vite双模式(esbuild快闪店/Rollup精品工坊)+ Tree Shaking摇树 + Code Splitting分批送
3套生命周期(clean/default/site)+ default核心9阶段 + 依赖解析路径(本地→私服→中央)+ 5种Scope + 依赖冲突解决(最短路径/先声明)
docker build分层构建+缓存机制 + docker pull分层下载 + docker run镜像→容器 + docker compose多容器编排 + Volume持久化 + 端口映射
CI/CD全链路8步流水线 + 3种部署策略(蓝绿/金丝雀/滚动)+ GitHub Actions实战 + Nginx反向代理配置 + 负载均衡