一招终结iOS/Android H5渲染差异

　　去年双十一前夜，小孟在编辑后台切第五版专题页，iOS上标题行高崩了，Android上正常，她截图甩进大群说“苹果又抽风”，我叼着半截没点的烟回她：“你删掉那行font-feature-settings试试。”

　　她真删了。三秒后回了个句号。然后补一句：“你刚才是不是在啃鸭脖？”——桌上那袋真空鸭脖确实开了，油渍印在键盘右下角ESC键上，我拿纸巾擦的时候蹭歪了Caps Lock键帽。

　　这事我原以为是Safari 16.4的字体渲染bug，结果查着查着发现安卓WebView居然悄悄兼容了旧写法，而iOS 17 beta2把font-feature-settings里带'salt'或'ss01'这种OpenType变体标识的整条声明当无效值跳过，连warning都不抛——但只跳过带引号的写法。不带引号？它认。带单引号？认。双引号？直接静默丢弃。就这三毫米的差异，让整个h2样式链塌了三层。

　　我们测过十八秒内连续刷新七次：第一次iOS加粗失效，第三次iOS开始渲染空白，第五次连行框都飘到父容器外边去了。可安卓那边稳得像没改过代码。老张蹲机房门口抽烟，听见我喊“再切个分支测下”，他弹了弹烟灰，说：“上次改这个还是你修完nginx重定向那次，那会儿空调外机漏氟，嗡嗡响。”他身后机柜风扇声是真吵，盖过了我敲Enter键的声音。

　　一招终结iOS/Android H5渲染差异。这话我说得笃定——因为半年前我们上线前四小时，就靠删掉那行带双引号的font-feature-settings，所有机型渲染一致。不是兼容，是剔除。优胜劣汰不是算法选最优解，是把唯一搞不定的变量从公式里物理删除。就像当年砍掉IE6支持一样，不是它不行，是它不值得你再花三个人天去对齐盒模型。

　　那天凌晨两点十七分，运维小陈接了个电话，听筒声音漏出来半句：“…对，就是那个H5专题，现在能切了…”他挂了电话后顺手把我桌上冷掉的豆浆喝了两口，杯子沿上留了个浅浅的唇印，没擦。

　　你肯定试过别的：viewport缩放、-webkit-text-stroke补丁、强制开启GPU加速…都绕不开一个死循环——越加兼容层，越暴露底层引擎分歧。反而最糙的法子最管用：看哪些CSS声明在两边行为不一致，挑出那个被一方当垃圾处理的，干掉。不是修复差异，是制造共识。共识从来不是协商出来的，是活下来的那个剩下的。

文章配图，仅供参考

　　不过我得说句实话：这个方法对字体变体控制类属性管用，对flex-gap在iOS 15.6的诡异偏移——我说不准。那玩意儿我试过用margin模拟，也试过用grid替，最后是前端组长自己写了个JS检测+重绘，但他说他也不知道为什么必须等DOMContentLoaded之后再触发，而不是load事件。这事儿我真没深挖，因为那天下午市场部催上线，我盯着屏幕右下角时间，看着它从16:58跳到16:59，手指悬在发布按钮上，听见隔壁工位小孟在哼《孤勇者》副歌，跑调。

　　后来小孟转岗做内容策略了。上周她微信问我：“你们现在还手动删font-feature-settings吗？”我没回。其实我们已经把它做成构建时的预处理器规则——但上周五CI又挂了，报错日志里有一行写着“font-feature-settings value contains unescaped double quote”，我扫了一眼，直接rm -f node_modules && npm ci重装，结果重装完build居然通过了。这个我敢打包票：不是缓存问题，是npm install某个版本恰好把v8引擎里的字符串解析逻辑给撞对了。玄学归玄学，但人不用管它，管它的人早离职了。

　　对了，前两天翻Git历史，看到那行被删的CSS原来是个实习生写的，commit message是“加个复古字体特效”，后面跟着个emoji笔尖。他现在在杭州做独立游戏，发过一条朋友圈，截图是Unity编辑器界面，右下角时间显示14:33，窗外天阴着，雨点正砸在玻璃上，噼啪响。

　　所以接下来？我把这条规则推到主干之前，先让它过三遍灰度——不是怕出问题，是怕出问题时没人记得当初为啥这么干。现在文档里写着“禁止在CSS中使用带双引号的font-feature-settings值”，底下跟了句括号备注：“参考2023年双十一大促第零版专题页事故（日期已模糊）”。够了。再细的，真没必要记。

（编辑：站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!