空HTML的坑

随便挑个大网站，右键点“查看源代码”试试。

你看到的，肯定不是页面上那堆花里胡哨的东西。就一副光杆司令：几个meta标签，可能有个CSS链接，再加一行关键代码：

<div id="app"></div>

没了。真正的内容——数据、布局、意思——全在别处。页面先刷出来，然后JavaScript包下载执行，从后头拉数据填进去。

以前可不是这样。要懂这变化，对做现代web app的人超级重要，尤其是关心速度、无障碍和SEO的。

最早的网页：纯文档时代

互联网刚起步，思路简单优雅：浏览器要文档，服务器发过去，浏览器直接渲染。屏幕上啥都有，HTML里全写着。想看就看，想懂就懂。

这不是缺点，是优点。

文档自带语境。一个日期在文章里，不是孤零零的数字，周遭文字解释清楚。链接不是光URL，旁边描述去哪。意思和数据绑一起，页面自成一体，好查。

查看源代码不是debug工具，是透明保证。

服务器后来能编程了（CGI、PHP、ASP），但本质没变。HTML从数据库动态生，但用户拿到的是完整成品。开发时模板、样式、后端分开，用前全合成一块。

用户吃的是整页大餐。

转折点：AJAX来了

然后XMLHttpRequest出现，一切变天。

浏览器能不刷新页面，拉数据更新局部。中2000年代，这叫AJAX。Google Maps是爆款——丝滑、响应快、有状态，像桌面app。

动机没毛病。为啥更新个部件还重载整页？导航静态部分反复发干嘛？AJAX解真问题。用户要好交互，开发者想做。

但有隐形成本。

巨大代价

2010年初，新思路成型：

1. HTML只发最小壳子
2. 加载JavaScript app
3. 从API拉数据
4. 运行时填UI

React、Angular、Vue这些框架，没错。真解决复杂状态、组件复用、大团队协作。让某些app从噩梦变可能。

但这彻底改了web玩法。

我们丢了啥（为啥要紧）

网页不再天生可查。

现代页面的HTML，跟用户眼里的东西八竿子打不着。数据、内容、交互，全不在源代码里。就那空<div id="app"></div>等着JS灌。

开发者懂页面，得追代码逻辑、API调用、模拟状态。没透明了。

机器呢？搜索引擎爬SEO、AI分析内容、无障碍工具解析结构，全变难题。得跑JS、模拟点击、跟踪变化、看副作用，才知页面真面目。

搜索引擎没法直接读HTML。无障碍工具猜不出层级。AI抓训练数据，得用headless浏览器渲染，资源耗大发。

深层原因

不光JS或框架。是思维转变。

老模式：页面=带意思的文档
新模式：页面=接口壳子，意思在外头

文档自解释。接口要解读。从文档转接口，换来响应和丰富，丢了透明和可查。

很多app值这价。Figma或Slack聊天，得是app，不是文档。

但这模式变默认。简单博客、落地页——纯内容货色——也做成SPA。钟摆荡过头。

对NameOcean用户的建议

我们NameOcean在意这个，因为你的domain和hosting得配你架构，别逼你复杂化。

做内容站、落地页、文字为主？用SSR或静态生成，超值。HTML带意思，搜索引擎秒懂。网慢用户先看到内容，不等JS。

要做交互牛逼的（仪表盘、设计工具、实时协作）？客户端重架构正好。但得清楚代价。

核心：知道为啥选，别人云亦云。

往前看

web未来是平衡。现代框架聪明了——首屏SSR、交互客户端、静态不变内容。

Next.js、Svelte、Astro证明：文档和app不是非此即彼。你两头要。

但得有意为之。按需求挑架构，别抄作业。让它可查、可索引、无障碍，还富交互。

web最牛时刻，总记得透明和强大是伙伴，不是对立。