重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
Server Side Rendering(服务端渲染)
巴东网站建设公司创新互联建站,巴东网站设计制作,有大型网站制作公司丰富经验。已为巴东千余家提供企业网站建设服务。企业网站搭建\外贸营销网站建设要多少钱,请找那个售后服务好的巴东做网站的公司定做!
SSR 目的是为了解决单页面应用的 SEO 的问题,对于一般网站影响不大,但是对于论坛类,内容类网站来说是致命的,搜索引擎无法抓取页面相关内容,也就是用户搜不到此网站的相关信息。
原理
将 html 在服务端渲染,合成完整的 html 文件再输出到浏览器。
适用场景
NUXT
作用就是在 node.js 上进一步封装,然后省去我们搭建服务端环境的步骤,只需要遵循这个库的一些规则就能轻松实现 SSR。
可以作为一个 Node.js 应用跑在服务器上,也可以把整站直接编译为静态 HTML。另外这个框架支持自动生成路由,用来写展示型的页面是非常不错的选择。
NUXT 能为我们做什么
安装流程
$ npm install -g vue-cli $ vue init nuxt/starter$ cd $ npm install $ npm run dev
Nuxt.js 会监听 pages 目录下的改变,添加新 page 的时候不需要重启服务
Next.js
来自Zeit的团队在React的基础和组件模型上构建了Next.js,同时还提供了一个关键扩展:通过使用名为getInitialProps()的组件生命周期钩子方法,框架能够在服务器上进行初始渲染,如果需要的话,还可以在客户端继续进行渲染。不过这个高级特性是一个很小却功能强大的框架所额外提供的。
Next提供了非常丰富的生态环境,特别是它的example,包含了多种情况下的源码,让学习者很容易搭建起一个多功能的Next框架,客户端有的东西,服务端基本都有。
简单易用,就跟写 PHP 一样一个文件一个页面了,但缺点也很明显,其实它是通过改变正常 React + webpack 的代码书写习惯来绕过前后端同构的坑,所以也引入了一些新的问题:
简单地说,很适合快速搭建简单站点,但自由度不高,且带样式或图片的 React 组件无法直接使用,个人看法是一个用自由度和通用性来换取易用性的框架。
其他方法
Google 可以正常爬取和渲染一个纯 js 动态生成的网站,上传 sitemap 就可以了。
直接生成静态页面由 cdn 分发。有些新技术还可以在 static gen 同时支持 pwa,比如 gatsbyjs。
掘金是未登录用户使用 SSR,不错的思路。
要分清楚什么时候用 mvvm,mvvm 其实就是 modelview 非常方便定义页面的各种逻辑和改变页面数据,如果是传统的网站,前端没啥逻辑,就没有必要上 mvvm
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持创新互联。