8月10日 打卡day15
今日学习：Islands 架构原理和实践
1、MPA 和 SPA
MPA：多页应用，每个页面都彼此独立，有自己的 URL
SPA：单页应用，只有一个没有具体页面内容的 HTML，当浏览器拿到该 HTML 后，会请求页面所需的 JS 代码，通过执行 JS 代码，完成 DOM 树的构建和 DOM 的事件绑定，从而让页面可以交互
2、 SSR/SSG 同构方案
MPA 和 SPA两者的结合，这类方案仍然会下载全量的客户端 JS 及执行全量的组件 Hydrate 过程，造成页面的首屏 TTI 劣化
由于页面中有时仍然不可避免的需要一些交互的逻辑，这就诞生了 Islands 架构
3、Islands 实现原理
①Astro 中，默认所有的组件都是静态组件
②Fresh基于 Preact 和 Deno 的全栈框架
今日学习：Islands 架构原理和实践
1、MPA 和 SPA
MPA：多页应用，每个页面都彼此独立，有自己的 URL
SPA：单页应用，只有一个没有具体页面内容的 HTML，当浏览器拿到该 HTML 后，会请求页面所需的 JS 代码，通过执行 JS 代码，完成 DOM 树的构建和 DOM 的事件绑定，从而让页面可以交互
2、 SSR/SSG 同构方案
MPA 和 SPA两者的结合，这类方案仍然会下载全量的客户端 JS 及执行全量的组件 Hydrate 过程，造成页面的首屏 TTI 劣化
由于页面中有时仍然不可避免的需要一些交互的逻辑，这就诞生了 Islands 架构
3、Islands 实现原理
①Astro 中，默认所有的组件都是静态组件
②Fresh基于 Preact 和 Deno 的全栈框架
展开
评论
点赞
![[微笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_1.7d9f699.png)
，官方包邮。
~
doc.hutool.cn