用 Astro + Solid 打造轻盈的交互岛
记录我如何在保持体积小的同时交付动态体验。
在内容型页面里，我尽量保持静态 HTML，只在需要实时状态的区域放置 Solid 岛屿：主题切换、实时 Playground 或数据浏览器。
实践要点：
- 先无状态：默认输出服务器渲染的标记，只有必要时再水合。
- 单一责任：把多个微交互归并到同一岛屿，减少水合开销。
- 数据前移：只序列化交互所需的最小 JSON，其余逻辑放在服务器端。
把计算留在 Astro，把互动交给 Solid，能同时兼顾性能与体验。
下面是一篇可以直接发到公众号 / 掘金 / Medium（中文）级别的文章草稿。我会把你方案的“关键发明点”写得足够清晰：在 iOS 上，键盘相关的可视区域变化往往来得太晚；你需要在用户手势触发的那一刻，提前把布局改造成“可滚动 + 已预留键盘空间”的状态，从而阻止 Safari/WKWebView 抢夺滚动控制权（尤其是 visual viewport 的那种暗滚）。