技术上，iframe 在手机上完全能跑。所以“移动端不内嵌”这个决定，一开始看起来像是在给自己找麻烦。
但我还是这么做了。理由是场景变了。
两个数字
一个 16:9 的 iframe，在 390px 宽的手机上，高度只有约 220px。
220px 是什么概念？比键盘弹起来后的可视区域还矮，差不多是三个输入框的高度。
把 Zifo 的朗读页、或者任何一块真实画布塞进这个框里，用户看到的是一个被压扁的、点不准的、拖动会和页面滚动打架的东西。它“能跑”，但不好用。
手机上用户要的不是这个
回到真实场景：一个人从社交平台点进来，在手机上。
他想要的是快速判断“这东西是什么、值不值得我花时间”。这时候给他一个能跑但难用的嵌入框，价值远低于给他一张清晰的封面加一个“新窗口打开”。
新窗口打开之后，应用占据整个屏幕，所有手势都正常，还能加到主屏幕——体验反而完整得多。
所以降级怎么做的
规则很简单，768px 以下：
- 默认动作变成“在新窗口打开”，并且是视觉上的主按钮
- 不再展示“点击试玩”，因为它会引导用户走进那条糟糕的路径
- 但仍然保留一个“仍在此页试玩”的次要链接——不替用户做最终决定
第三条是我特意加的。降级的意思是在默认路径上做判断，而不是剥夺选择权。偶尔有人就是想在小窗里快速看一眼，拦着他不合理。
这个判断在客户端完成，用 matchMedia 监听断点，浏览器窗口拖动跨过 768px 时也会实时切换。
一个容易忽略的连带问题
如果桌面端用「点击后加载」、移动端用「外链」，那移动端就永远不会加载 iframe——这正好也省掉了移动端的流量和内存开销。
换句话说，这个决定同时优化了体验和性能，两个目标在这个点上是一致的。