```html

前端web

昨天调一个弹窗组件的层级，z-index: 9999 依然被一个不知道从哪冒出来的前端 <div> 盖住。打开 DevTools 一层层扒，前端最后发现是前端某个第三方库偷偷往 body 末尾塞了个 <iframe>，它的前端层叠上下文直接让我的弹窗变成了背景板。那一刻我盯着屏幕，前端觉得前端这玩意儿真像在别人搭好的前端积木塔上再插一根牙签——你永远不知道哪块积木会突然塌。

很多人以为前端就是前端写写页面、调调颜色。前端早几年我自己也这么觉得，前端直到第一次接手一个老项目，前端jQuery 和 Vue 混着用，前端一个点击事件绑了三遍，前端改一处样式要全局搜 !important。前端那感觉像在早高峰的前端地铁里找一只掉在地上的耳机——你知道它就在附近，但每弯一次腰都会被后面的人推着往前走。

浏览器是个极其宽容又极其固执的东西。你写 display: flex，它认；你写 float: left 再叠个 margin-left: -3px，它也认，只是渲染出来的东西可能跟你脑子里想的隔了半个银河系。我见过一个按钮在 Chrome 里完美居中，到了 Safari 就偏了 2px，查了半天发现是字体渲染的基线差异。2px 而已，但设计师的眼里揉不得沙子，最后用 transform: translateY(0.5px) 硬怼回去。你说这算技术还是算玄学？我觉得算手感。

“前端工程师的日常，就是用 20% 的时间写代码，80% 的时间跟浏览器解释‘我写的到底是什么’。”

框架换了一茬又一茬。Backbone 火的时候我在写 el: '#app'，Angular 1 的双向绑定让人眼前一亮，React 带着 JSX 进来时很多人骂“把 HTML 写进 JS 是倒退”，现在再看，useState 和 useEffect 已经成了空气一样的存在。Vue 的模板语法对新人友好，但 v-if 和 v-show 用混了照样出 bug。工具在变，底层的 DOM 事件模型、盒模型、渲染流水线没怎么变。你绕不开的。

移动端兴起那几年，适配方案从 rem 到 vw 再到 clamp()，每个方案背后都是一堆真机测试的辛酸泪。我在一台老安卓机上见过一个 position: sticky 完全失效，滚动时元素直接飞走。查 caniuse 才发现那台机器的 WebView 版本太老。你能怎么办？写个 JS 监听滚动手动算位置呗。性能？先保证能用再说。

性能优化是个无底洞。首屏加载从 3 秒压到 1.5 秒，你以为赢了，结果老板说“能不能再快 0.5 秒”。拆包、懒加载、CDN、图片压缩、字体子集化……每一样都能写一篇论文。但最有效的往往是那些最土的办法：把不需要的第三方库删掉，把 console.log 去掉，把没用的 CSS 类清理干净。我见过一个项目打包出来 4MB，最后发现里面塞了两个不同版本的 moment.js。删掉一个，体积直接掉 300KB。你说这算技术活吗？算细心活。

前端的天花板在哪，没人说得清。有人深耕可视化，用 WebGL 画几万个粒子；有人搞工程化，写 webpack 插件写到凌晨三点；有人转全栈，用 Node 写 BFF 层。但不管往哪走，有一件事绕不开：你得对“用户看到什么、点了什么、等了几毫秒”这件事有感觉。这种感觉没法从文档里学，只能一个项目一个项目地磨。就像学做菜，菜谱告诉你放盐 3 克，但真正下锅那一下，手抖不抖只有自己知道。

所以每次有人问我“前端好不好学”，我都说：入门容易，精通难。你能在三天内用 Vue 搭出一个 TodoList，但你可能花三年才搞明白为什么一个 transition 在低端机上会掉帧。这行当更新快，但底层的那些坑，十年前在踩，十年后大概率还在踩。区别只是你踩的时候，是骂骂咧咧地打开搜索引擎，还是嘴角一扬，心里想“哦，又是你”。