写点什么

Aleph.js 发布 Alpha 版,一个基于 Deno 的服务器端渲染框架

  • 2021-01-15
  • 本文字数:1606 字

    阅读完需:约 5 分钟

Aleph.js发布Alpha版,一个基于Deno的服务器端渲染框架

Aleph.js 是基于Deno的React框架,用于服务器端渲染应用程序,现在发布了Alpha版。Aleph 让Next.js的很多核心特性在 Deno 环境中可用:零配置的服务器端渲染、静态站点生成、文件系统和 API 路由,等等。Aleph 使用标准的 EcmaScript 模块(ESM)import 语法,在开发环境中不使用打包器。Aleph 还借助react-refresh提供了模块热替换。


Aleph.js 深受 Next.js 的启发,后者自称是一个生产就绪的 React 框架。与 Next.js 一样,Aleph 提供了高效的特性,为开发者提供了更好的体验。Alpha 版的 Aleph 提供了基于页面的路由系统(支持动态路由)、API 路由、基于路由的国际化支持、静态站点生成、默认预渲染(具有可配置的服务器端渲染)、客户端路由、CSS 和 Sass 支持,以及 react-refresh 支持。在开发 Web 应用程序时,开发人员将使用一组页面和 API,每个页面都用一个 React 组件实现。


与 Next.js 不一样的是,Aleph 是基于 Deno 的。Deno 是 Node.js 的替代品,旨在弥补 Node 的缺点。Deno 在今年早些时候发布了它的第一个主要版本,开箱即用地支持 TypeScript。Deno 有一个更严格的安全模型,不允许任何文件、网络或环境访问,除非显式地启用。Deno 不使用 package.json 文件、node_modules 目录或 CommonJS 模块。相反,Deno 采用 EcmaScript 模块(ESM),并将依赖项作为 URL 导入。


Aleph 的文档解释了使用 Deno 模块的一个生产力优势:


每个模块只需要编译一次,然后缓存到磁盘上。当模块发生变化时,只需重新编译该模块,重新打包不会浪费时间。


下面是 Aleph 的一个简单例子:


import React from "https://esm.sh/react@17.0.1"import Logo from "../components/logo.tsx"export default function Home() {    return (      <div>        <Logo />        <h1>Hello World!</h1>      </div>    )}
复制代码


Aleph 通过放在应用程序根目录的import_map.json文件来支持导入映射。导入映射是Web Incubator Community Group(WICG)提出的一个建议,可用解析原始导入标识符。有了导入映射,Aleph 可以将从 import React from "react"替换为 import React from “https://esm.sh/react@16.13.1”。


在开发过程中,Aleph.js 需要现代浏览器来支持ESM模块和动态导入。现代浏览器包括 Chrome(>=61)、Edge(>=16)、Firefox(>=60)、Safari(>=11)和 Opera(>=48)。


开发人员可以使用 Deno 运行时在构建时计算数据,并将数据传递给页面。一些框架,如Dojo,将这种方法称为构建时渲染。Next.js 提供了getStaticPropsgetServerSideProps方法,用于在构建时或发送请求时获取数据。


开发人员可以定制404 页面,也可以使用自定义的<App>、<Head>和<Scripts>组件来控制页面初始化(全局布局或样式),并自定义页面上的<head>和<scripts>标签。如下所示:


import React from "https://esm.sh/react"import { Head, Scripts } from "https://deno.land/x/aleph/mod.ts"export default function App({ Page, pageProps }) {  return (    <>      <Head>        <title>Aleph.js</title>      </Head>      <Scripts>        <script async src="https://www.googletagmanager.com/gtag/js?id=G-1234567890"></script>        <script>{`          window.dataLayer = window.dataLayer || [];          function gtag(){            dataLayer.push(arguments);          }          gtag('js', new Date());          gtag('config', 'G-1234567890');        `}</script>      </Scripts>      <Page {...pageProps} />    </>  )}
复制代码


Aleph 还处在 Alpha 阶段,并且还在积极开发当中。Aleph 计划在生产环境中使用经过 polyfill 的 nomodul .js 来支持老浏览器(例如 IE11),它使用SystemJS来导入模块。有关提供 PWA 和 AMP 支持的进一步工作也在进行当中。


开发人员可以在线访问Aleph的文档。Aleph 是采用了 MIT 开源许可。欢迎开发人员加入贡献和反馈,并遵守 Aleph 的贡献指南


原文链接

Server-Rendered Web Applications in Deno with Aleph.js

2021-01-15 17:122758

评论

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

云原生、20.3k Star......时序数据库 TDengine 的 2022 年精彩纷呈

TDengine

数据库 tdengine 开源 时序数据库

2022,我们追逐群星,也在追逐AIGC的无尽可能

脑极体

开源全球公司贡献 49 名,涛思数据荣登 2022 中国开发者影响力年度榜单

TDengine

tdengine 时序数据库

这88道阿里高级岗面试题,刷掉了80%以上的Java程序员

钟奕礼

编程 程序员 Java 面试 Java、

10 万字节Spring Boot +redis详细面试笔记(带完整目录)免费分享

钟奕礼

程序员 Java 面试 Java、 java 编程

恭喜 KubeVela 获得中国开源云联盟 2022 “优秀开源项目”

阿里巴巴云原生

阿里云 开源 云原生 KubeVela

建信信托真的可靠吗?投资者含泪控诉

鳄鱼视界

刷完200+大厂Java真题手册,成功拿到阿里,京东,美团的offer

钟奕礼

程序员 Java 面试 Java、 java 编程

备受企业青睐的华为云CDN优势到底在哪?

路过的憨憨

惊喜来袭!阿里内部Java开发成长手册(2022纯享版)开源

程序知音

Java 阿里 java面试 后端技术 Java面试八股文

【喜报】OpenCloudOS 荣获2022 中国技术力量年度榜单「十大开源新锐项目」

腾源会

开源 opencloudOS

华为云CDN,助力安全企业下载服务,更好提升用户体验

路过的憨憨

华为云CDN提升网站响应速度,让下载快人一步

路过的憨憨

MonographDB获得IT168“2022年度创新产品奖”

极客天地

公司刚来的阿里p8,看完我构建的springboot框架,甩给我一份文档

钟奕礼

程序员 Java 面试 Java、 java 编程

既要速度与激情,也要稳定和安全,华为云CDN让你速度和安全兼得

路过的憨憨

读书|我的2022年度阅读推荐

MavenTalker

推荐书单

建木v2.6.2发布

Jianmu

开源 DevOps 持续集成 低代码 CI/CD

蚂蚁金服Java研发岗二面:说说HashMap 中的容量与扩容实现

钟奕礼

程序员 Java 面试 Java、 java 编程

我坦白→低代码功能我有,SQL练习题、数据可视化、数据填充助你高效

非喵鱼

sql 低代码 可视化 eCharts 数据库·

编程培训后程序员怎么提升自身开发水平?

小谷哥

启科量子部署工具 Runtime 正式开源

启科量子开发者官方号

部署 量子

AI for Science的上半场:人工智能如何重新定义科学研究新范式?

脑极体

Flink Shuffle 3.0: Vision, Roadmap and Progress

Apache Flink

大数据 flink 实时计算

2022年最全大厂面试真题解析:java集合+spring+并发编程+MyBatis

钟奕礼

程序员 Java 面试 Java、 java 编程

一个深度学习框架的年度报告

MegEngineBot

深度学习 年终总结 MegEngine

Pg数据库日常维护操作指南

查拉图斯特拉说

数据库 postgresql PgSQL

华为云CDN加速服务,引领企业数字化发展潮流!

路过的憨憨

对标阿里P7:高并发+Nginx+微服务+消息中间件+Netty+Redis+MySQL

程序知音

Java 数据库 JVM 高并发 后端技术

腾讯云在中国公有云开发和基础设施平台分析师报告中入选领导者阵营

科技热闻

Aleph.js发布Alpha版,一个基于Deno的服务器端渲染框架_大前端_Bruno Couriol_InfoQ精选文章