限时领|《AI 百问百答》专栏课+实体书(包邮)! 了解详情
写点什么

Web 框架 Astro 2.0 发布,在静态和动态渲染之外提供了混合渲染能力

  • 2023-04-14
    北京
  • 本文字数:1044 字

    阅读完需:约 3 分钟

Web框架Astro 2.0发布,在静态和动态渲染之外提供了混合渲染能力

Web 框架 Astro 最近发布了2.0版本,在原先的静态和动态服务器渲染功能之上提供了新的混合渲染功能。混合渲染可用于渲染特定页面,以此来获得更高的渲染性能。


Astro Web 框架旨在普及一种叫作“组件岛”的前端架构,这也是 Astro 推出混合渲染的动机:


在将近一年的时间里,Astro 都只允许用户在静态(SSG)和服务器(SSR)渲染之间二选一。静态网站提供了令人难以置信的性能,但缺少为不同请求按需生成 HTML 的能力。


Astro 2.0 的混合渲染把这两种渲染能力结合在了一起。


将静态和动态内容混合在一起可以带来新的可能性:


1. 提高热度页面的渲染性能;

2. 提高大型站点的构建性能;

3. 向已有的静态站点中加入 API。


在之前的版本中,使用 Astro 的开发人员必须在静态渲染(针对静态的、内容主导的网站)或服务器端渲染之间做出选择。有了混合渲染,开发人员可以在构建时预渲染特定的页面或服务器端点,无需放弃已部署的服务器。


大型网站通常有适合使用预渲染技术生成内容的部分,也有需要在请求时生成内容的部分。例如,电子商务网站会预先渲染主页和各种以营销为重点的内容,而产品、价格或折扣页面则使用服务器端渲染,以呈现最新可用的数据。这种混合方法可能会降低渲染网页所需的计算资源量和相关的成本。


对于使用Jamstack的大型站点,比较有价值的是增量静态生成,这是由应用程序框架 Next.js 推广的一种渲染方式。


Astro 新版本还提供了重新设计的错误叠加,改进了对开发阶段模块热加载的支持,并使用了新发布的Vite 4.0来构建内容。


Astro 是一个旨在为以内容为中心的网站提升用户体验的 Web 框架。为此,Astro 尽可能少向客户端发送 JavaScript,确保页面的交互性是可用的。对于完全静态的页面,根本不发送 JavaScript。Astro 为此提出了“组件岛”架构。Web 页面被划分为静态 HTML 内容,其中穿插着称为 Astro 岛的交互式 UI 组件。组件岛是独立渲染的,可以使用任意的 UI 框架(例如,React、Preact、Svelte、Vue、Solid、Lit)。


Astro 宣称自己是“专为速度而设计的一体化 Web 框架”。其基准测试(基于Chrome用户体验报告[CrUX]The HTTP Archive核心Web重要技术报告)报告显示,Astro 的性能优于其他 Web 框架(Sveltekit、Gatsby、Remix、WordPress、Next、Nuxt)。


Astro 是一个采用了 MIT 许可的开源项目。欢迎开发者参与贡献和反馈


原文链接

https://www.infoq.com/news/2023/04/astro-2-hybrid-rendering/


相关阅读:

Web 前端开发最好用的几个 WebGL 框架

Web、移动端、桌面端自动化测试工具或框架推荐

Web 前端设计开发工具集(JS 框架、CSS 预处理)

传统 Web 框架部署与迁移

2023-04-14 14:106126

评论

发布
暂无评论
发现更多内容

一文读懂 MongoDB驱动程序 API

MongoDB中文社区

mongodb

MongoDB案例分享:如何使用oplog恢复数据

MongoDB中文社区

mongodb

经验分享 | 搭建帮助中心的最强攻略

小炮

APICloud平台使用融云模块实现音视频通话实践经验总结分享

YonBuilder低代码开发平台

前端开发 APP开发 APICloud 融云 跨端开发

企业内PAAS建设的经验与教训

Crazy

中间件 PaaS 经验 云原生应用

盲盒风潮过后,中国收藏玩具市场该何去何从?

易观分析

盲盒 潮玩

聊聊 kerberos 的 kinit 命令和 ccache 机制

明哥的IT随笔

数据安全 kerberos

龙蜥开发者说:做开源,兴趣是最好的源动力 | 第1期

OpenAnolis小助手

开源 创作 开发者故事 兴趣是动力

基于WEB快速开发平台的轻量ERP

雯雯写代码

ERP 快速开发平台

租房小程序

源字节1号

前端开发 后端开发 租房小程序

你的密钥被我看见了 !逆向获取密钥

H

网络安全 逆向

基于深度学习的时间序列预测

云智慧AIOps社区

杜绝不良信息侵害未成年,皮皮APP发起语音社交行业自律书

联营汇聚

安全app之PHP代码审计

网络安全学海

网络安全 信息安全 渗透测试 WEB安全 代码审计

敏捷小游戏的思考-上篇

LigaAI

团队管理 敏捷实践

基于微信小程序的大学社团平台的可研方案

CC同学

关于知识库:你需要知道的一切

小炮

如何从头到脚彻底解决一个MySQL Bug

华为云开发者联盟

MySQL 数据库 华为云 bug GaussDB(for MySQL)

2 月月更获奖名单公布!获奖的小伙伴速速领取奖励啦!

InfoQ写作社区官方

2月月更 热门活动

好云推荐官丨飞天加速之星怎样选择云服务器ECS?

阿里云弹性计算

阿里云 采购季 好云推荐官

做毕设用不起GPU?亚马逊云SageMaker免费给你用

亚马逊云科技 (Amazon Web Services)

学习

什么是以特性为核心的持续交付|阿里巴巴DevOps实践指南

阿里云云效

云计算 阿里云 研发效能 研发 DevOps实践指南

fastposter v2.6.0 发布 电商海报生成器

物有本末

fastposter 海报生成器 电商海报

Hoo虎符研究院| 稳定币的主要分类及发展趋势

区块链前沿News

虎符研究院 稳定币

聊聊编程中的 “魔数”

程序员鱼皮

【Python训练营】Python每日一练----第31天: k倍区间

是Dream呀

3月月更

被冰封的 Bug:Fishhook Crash 修复纪实

声网

Dev for Dev fishhook

openGauss社区成立ReleaseManagement SIG

VuePress 博客之 SEO 优化(一) sitemap 与搜索引擎收录

冴羽

Vue vuepress SEO 博客搭建 sitemap

租房小程序

源字节1号

前端开发 后端开发 租房小程序

手把手教程|构建无服务器通用文本识别功能

亚马逊云科技 (Amazon Web Services)

架构

Web框架Astro 2.0发布,在静态和动态渲染之外提供了混合渲染能力_大前端_Bruno Couriol_InfoQ精选文章