剑客
关注科技互联网

Next.js 开源,提供基于 React 的简单通用 JS 框架

新的通用JavaScript框架 Next.js目前已经开源了 ,它为基于React和服务器的Web应用提供了一个新的可选方案。

来自 Zeit 的团队在React的基础和组件模型上构建了Next.js,同时还提供了一个关键扩展:通过使用名为 getInitialProps() 的组件生命周期钩子方法,框架能够在服务器上进行初始渲染,如果需要的话,还可以在客户端继续进行渲染。不过这个高级特性是一个很小却功能强大的框架所额外提供的。

按照Next.js的最小功能集,它提供了一种便利的方式来创建新的Web应用,这个过程中,并不需要很多的工具集配置。类似于 create-react-app ,安装这个框架会搭建一个基于React、Webpack和Babel的构建过程。以往编写React组件的开发人员将会基于React语法来创建页面,每个页面提供了一个render函数:

import React from ‘react’ export default () => Hello world!

Next.js使用 filesystem作为API ,所以每个放到 pages 文件夹中的组件将会自动映射为一个基于服务器的路由。比如,磁盘上的 pages/about.js 组件将会自动服务于 /about 这个URL。

express-react-views 这样的项目不同,它是构建在Express之上的视图引擎,而next.js是一个顶层的服务层,只渲染JavaScript函数的结果。为了实现这一点,该项目使用 glamor 来处理CSS,而不是依赖于单独的CSS文件。

在Next.js中,每个路由都是一个简单的ES6模块,这个模块会导出一个函数或扩展自React.Component的类。

Next.js这种本质上的倾向性会有一些微妙的优势,其中之一就是开发人员不必在搭建Webpack或Babel配置上花费时间了。以往,这两个步骤就会耗费开发人员很多的时间。要运行某个站点的开发版本,只需运行 npm run dev

对于一些开发团队来说,通用(Universal)的JavaScript依然是一项更为高级的技术,很多的框架都有自己的实现。Angular 2有 Universal Angular 2 , Ember有 Fastboot 。在React领域中,这方面的可选方案也不少,比如Walmart的 Electrode 和Redfin的 React Server 。现在,Next.js作为一个很简单的可选方案,具有很大的潜力。该项目在 GitHub上 已经开源。

前端之巅

前端之巅是关注前端技术的垂直社群,欢迎各位前端工程师的加入!加群请关注“前端之巅”公众号并发送“加群”,投稿请关注后回复“投稿”。

本文为『前端之巅』原创,作者为David Iffland ,译者为 张卫滨  ,点击阅读原文可查看本文英文版,转载请在开头处注明来自『前端之巅』公众号

查看本文链接版请移步: http://www.infoq.com/cn/news/2016/11/next-js-universal-react-framewor

视野拓展

移动平台如何与AR/VR、视频、硬件创新等新技术相结合?Hybrid是否是移动技术的最佳形式?创业公司如何选择适合自己的移动架构?相约ArchSummit北京2016,与来自腾讯、阿里等移动技术专家们一起深入移动架构的选择与思考 ArchSummit 9折倒计时,点击“阅读原文”了解详情

Next.js 开源,提供基于 React 的简单通用 JS 框架
Next.js 开源,提供基于 React 的简单通用 JS 框架
Next.js 开源,提供基于 React 的简单通用 JS 框架

今日荐文

踏上可信前端之路:保护代码,JS混淆到底是不是纸老虎?

精彩看点

混淆对性能的影响

由于增加了废代码,改变了原有的AST,混淆对性能肯定会造成一定的影响,但是我们可以通过规则来控制影响的大小。

  • 减少循环混淆,循环太多会直接影响代码执行效率

  • 避免过多的字符串拼接,因为字符串拼接在低版本IE下面会有性能问题

  • 控制代码体积,在插入废代码时应该控制插入比例,文件过大会给网络请求和代码执行都带来压力

我们通过一定的规则完全可以把性能影响控制在一个合理的范围内,实际上,有一些混淆规则反而会加快代码的执行,比如变量名和属性名的压缩混淆,会减小文件体积,比如对全局变量的复制,会减少作用域的查找等等。在现代浏览器中,混淆对代码的影响越来越小,我们只需要注意合理的混淆规则,完全可以放心的使用混淆。

Next.js 开源,提供基于 React 的简单通用 JS 框架 长按二维码关注

         前  端  之  巅

        紧 跟 前 端 发 展
        共 享 一 线 技 术

万 名 淀 粉 互 助

共 登 前 端 之 巅

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址