乱序 HTML 流技术正从 JavaScript 框架下沉到浏览器原生能力。该模式允许浏览器在页面尚未完全加载时,就动态填充占位符并支持用户交互。Chrome 150 已正式支持声明式功能,Safari 和 Firefox 也表态跟进。开发者可通过 `<template for="id">` 声明插入点,服务端以流式返回匹配的 `<script type="text/html" data-for="id">` 内容即可自动挂载,无需 JavaScript 驱动,属于纯声明式、渐进增强方案,并兼容现有 SSR 架构。规范还定义了 setHTML、streamHTML 等统一的 DOM 插入方法及流式处理 API,配合 Fetch 的 textStream() 可将动态 HTML 片段直接流式传输到目标容器。该技术最早由 Facebook BigPipe 于 2009 年提出,后经 React Suspense 和 Next.js 等框架普及,如今被内化到浏览器引擎中,实现了渲染技术的标准化,核心目标是防止页面中计算耗时的部分阻塞整体加载。
📱 每天一份 AI 前沿日报
关注公众号,每天 09:00 推送 · 不错过任何重磅