问答
它的开发体验和终端用户体验都很好,所以我们决定开源出来给大家共享。
客户端大小根据应用需求不一样大小也不一样。
一个最简单 Next 应该用 gzip 压缩后大约65kb
是或不是.
是,因为它让你的 SSR 开发更简单。
不是,因为它规定了一定的目录结构,使我们能做以下更高级的事:
- 服务端渲染
- 自动代码分割
此外,Next.js 还提供两个内置特性:
- 路由与懒加载组件:
<Link>
(通过引入next/link
) - 修改
<head>
的组件:<Head>
(通过引入next/head
)
如果你想写共用组件,可以嵌入 Next.js 应用和 React 应用中,推荐使用create-react-app
。你可以更改import
保持代码清晰。
Next.js 自带styled-jsx库支持 CSS 嵌入 JS。而且你可以选择其他你喜欢的嵌入方法到你的项目中,可参考文档嵌入样式。
我们遵循 V8 引擎的,如今 V8 引擎广泛支持 ES6 语法以及async
和await
语法,所以我们支持转换它们。但是 V8 引擎不支持修饰器语法,所以我们也不支持转换这语法。
可以参照这些 以及 这些
Next.js 的特别之处如下所示:
- 路由不需要被提前知道
- 路由总是被懒加载
- 顶层组件可以定义生命周期
getInitialProps
来阻止路由加载(当服务端渲染或路由懒加载时)
因此,我们可以介绍一个非常简单的路由方法,它由下面两部分组成:
- 每个顶层组件都将会收到一个
url
对象,来检查 url 或修改历史记录 <Link />
组件用于包装如(<a/>
)标签的元素容器,来执行客户端转换。
我们使用了些有趣的场景来测试路由的灵活性,例如,可查看nextgram。
我们通过请求处理来添加任意 URL 与任意组件之前的映射关系。
在客户端,我们<Link>
组件有个属性as
,可以装饰改变获取到的 URL。
这由你决定。getInitialProps
是一个异步函数async
(也就是函数将会返回个Promise
)。你可以在任意位置获取数据。
是的! 这里有个例子Apollo.
是的! 这里有个例子
从我们第一次发版就已经提供很多例子,你可以查看这些例子。
我们实现的大部分目标都是通过 Guillermo Rauch 的Web 应用的7原则来启发出的。
PHP 的易用性也是个很好的灵感来源,我们觉得 Next.js 可以替代很多需要用 PHP 输出 HTML 的场景。
与 PHP 不同的是,我们得利于 ES6 模块系统,每个文件会输出一个组件或方法,以便可以轻松的导入用于懒加载和测试
我们研究 React 的服务器渲染时并没有花费很大的步骤,因为我们发现一个类似于 Next.js 的产品,React 作者 Jordan Walke 写的react-page (现在已经废弃)