把握行业变革关键节点,12 月 19 日 - 20 日,AICon北京站即将重磅启幕! 了解详情
写点什么

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:106459

评论

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

AI 背单词 App 的技术架构

北京木奇移动技术有限公司

软件外包公司 AI英语学习 AI背单词

MyEMS能源管理系统后台配置-计量表管理

开源能源管理系统

开源 能源管理

告别人工误差与效率瓶颈:智能仓储助力烟草企业实现精益化管理

中烟创新

HDFS迁移:企业数据迁移的高效之旅与优化攻略

袋鼠云数栈

数据库 数据治理 数据迁移 数据管理 数栈

森马服饰从 Elasticsearch 到阿里云 SelectDB 的架构演进之路

SelectDB

大数据 BI ES Doris 实时数仓架构

正品库拍照PWA应用的实现与性能优化|得物技术

得物技术

PWA

三角偶极子天线(下)---MIMO系统, 包络相关系数ECC和分集增益DG

思茂信息

cst仿真软件 CST软件 CST Studio Suite

智慧灌区系统(源码+文档+讲解+演示)

深圳亥时科技

ASP.NET Core 防伪令牌系统

qife122

ASP.NET Core 防伪令牌

Mike Cohn 解析:产品待办列表梳理

ShineScrum

PO 迭代 计划会议

怎么修改网站域名的DNS服务器?

防火墙后吃泡面

全球LED大屏广告市场解析

Dylan

广告 LED显示屏 全彩LED显示屏 led显示屏厂家 户内led显示屏

MyEMS能源管理系统后台配置-数据源管理

开源能源管理系统

开源 能源管理

VKProxy新增CORS设置和http响应缓存

八苦-瞿昙

Proxy csharp

百度商业发布全球首个中文音视频一体化生成模型MuseSteamer

极客天地

AI英语听力APP的核心功能

北京木奇移动技术有限公司

软件外包公司 AI听力学习 AI英语学习

在AI时代,挖掘新需求比实现功能更具挑战性

qife122

开发者工具 需求分析

CANN开放端侧NPU自定义算子编程,助力QQ音乐首创移动端实时声伴分离

HarmonyOS SDK

harmoyos

搜索数据建设系列之数据架构重构

百度Geek说

spark 计算引擎 数仓模型设计 图灵

软件测试丨Playwright测试工程师必备技能总结

测试人

软件测试

假如你从7月开始准备Java面试,如何秋招拿下offer?

程序员高级码农

java 程序员‘

CAD一键锁定坐标,图块批量插入快人N步!

在路上

cad 浩辰CAD CAD看图王

号码生成系统的创新实践:游戏周周乐幸运码设计

vivo互联网技术

redis 架构 后端 高并发 库存

AI英语听力APP开发

北京木奇移动技术有限公司

软件外包公司 AI英语学习 AI听力APP

Spring Boot 插件化开发模式,忒香了!

Geek_e3e86e

Java 编程

Alpha系统联结大数据、GPT两大功能,助力律所管理降本增效

科技汇

Taobao Agent Russia丨俄罗斯淘宝代购集运系统搭建指南

tbapi

淘宝代购系统 俄罗斯淘宝代购系统

全面加速!华能能源交通公司携手用友,开启现代供应链数智化新征程

用友BIP

去中心化 AI 生态基于DePIN起飞

PowerVerse

AI DePIN

时序数据库 TDengine × Node-RED:打造开箱即用的工业数据自动化流程

TDengine

tdengine 时序数据库 国产时序数据库 时序数据库tdengine

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