使用 Vue 2.0 实现服务端渲染的 HackerNews
Vue 2.0 支持服务端渲染 (SSR),并且是流式的,可以做组件级的缓存,这使得极速渲染成为可能。同时, 和 2.0 也都能够配合 SSR 提供同构路由和客户端 state hydration。vue-hackernews-2.0 是 Vue 作者在GitHub上面放的 Vue 2.0 的一个示例项目,结合 Express、vue-router & vuex 来构建,是很好的学习案例。
Features
- Server Side Rendering
- Vue + vue-router + vuex working together
- Server-side data pre-fetching
- Client-side state & DOM hydration
- Single-file Vue Components
- Hot-reload in development
- CSS extraction for production
- Real-time List Updates with FLIP Animation
Architecture Overview
Build Setup
Requires Node.js 6+
- # install dependencies
- npm install
- # serve in dev mode, with hot reload at localhost:8080
- npm run dev
- # build for production
- npm run build
- # serve in production mode
- npm start
编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
使用 Vue 2.0 实现服务端渲染的 HackerNews的更多相关文章
- 使用 PHP 来做 Vue.js 的 SSR 服务端渲染
对于客户端应用来说,服务端渲染是一个热门话题.然而不幸的是,这并不是一件容易的事,尤其是对于不用 Node.js 环境开发的人来说. 我发布了两个库让 PHP 从服务端渲染成为可能.spatie/se ...
- React(0.13) 服务端渲染的两个函数
1.React.renderToString 函数, 参数是组件,返回一个字符串 <!DOCTYPE html> <html> <head> <title& ...
- 改造@vue/cli项目为服务端渲染-ServerSideRender
VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...
- 实例PK(Vue服务端渲染 VS Vue浏览器端渲染)
Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...
- Vue服务端渲染和Vue浏览器端渲染的性能对比
Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...
- Vue.js 服务端渲染业务入门实践
作者:威威(沪江前端开发工程师) 本文原创,转载请注明作者及出处. 背景 最近, 产品同学一如往常笑嘻嘻的递来需求文档, 纵使内心万般拒绝, 身体倒是很诚实. 接过需求,好在需求不复杂, 简单构思 后 ...
- Vue服务端渲染 VS Vue浏览器端渲染)
Vue 2.0 开始支持服务端渲染的功能,所以本文章也是基于vue 2.0以上版本.网上对于服务端渲染的资料还是比较少,最经典的莫过于Vue作者尤雨溪大神的 vue-hacker-news.本人在公司 ...
- 如何使用Vue2做服务端渲染
花费了一个月时间,终于在新养车之家项目中成功部署了vue2服务端渲染(SSR),并且使用上了Vuex 负责状态管理,首屏加载时间从之前4G网络下的1000ms,提升到了现在500-700ms之间,SS ...
- Vue2服务端渲染
Vue2 服务端渲染 花费了一个月时间,终于在新养车之家项目中成功部署了vue2服务端渲染(SSR),并且使用上了Vuex 负责状态管理,首屏加载时间从之前4G网络下的1000ms,提升到了现在500 ...
随机推荐
- SQL Server 2014聚集列存储索引
转发请注明引用和原文博客(http://www.cnblogs.com/wenBlog) 简介 之前已经写过两篇介绍列存储索引的文章,但是只有非聚集列存储索引,今天再来简单介绍一下聚集的列存储索引,也 ...
- 怎样在Dos里切换盘符
一:在Dos里切换盘符 a:在电脑左下角右击显示图片;(我用的是win10系统,其他系统类似) b:点击运行,输入cmd; c:点击确定: d:输入盘符:(如f:) 或F: 只写字母,不写分号是不行的 ...
- http协议(十一)http与https
一.http的缺点 之前有介绍过http协议相关的一些知识,http是相当优秀和方便的,但它也有缺点,主要不足表现在如下几个方面: △ 通信使用明文(不加密),内容可能会被窃听 △ 不验证通信方的身份 ...
- Firefox开发者专版浏览器,Web开发者利器.
2015的11月9日,Firefox迎来了自己的十周岁生日.在庆祝Firefox十周年之际,Mozilla发布了Firefox开发者专版,这是首款专门为开发者打造的浏览器. 浏览器中独特的暗色调设计. ...
- Linux学习日记-EF6的安装升级(三)
在vs2013中使用EF是5的但是如果想使用 “来自数据库据的Code First” 这个生成模板就会发现 它会提示你EF的版本太低请升级 下面就是解决办法: 安装实体框架6 在工具菜单中,点击NuG ...
- .NET 基础一步步一幕幕[out、ref、params]
out.ref.params out: 如果你在一个方法中,返回多个相同类型的值的时候,可以考虑返回一个数组. 但是,如果返回多个不同类型的值的时候,返回数组就不行了,那么这个时候, 我们可以考虑使用 ...
- xcode低版本调试高版本真机系统
低版本xcode调试本真机高版本系统 //打开此路径把最新的文件拷贝到这里就可以了 /Applications/Xcode.app/Contents/Developer/Platforms/iPhon ...
- .Net开源工作流Roadflow的使用与集成
序言 最近公司要整理公司内部oa系统,需要使用到工作流,所以就开始了开源工作流挑选,使用,到集成到公司内部系统的工作. 首先在网上搜了文档,自己也有补充,整理啦国内几款工作流的比较,由于没有个个击破式 ...
- BOM,DOM,ECMAScripts三者的关系
一:DOM 文档对象模型(DOM)是表示文档(比如HTML和XML)和访问.操作构成文档的各种元素的应用程序接口(API) DOM是HTML与JavaScript之间沟通的桥梁. DOM下,HTM ...
- 【原】SDWebImage源码阅读(三)
[原]SDWebImage源码阅读(三) 本文转载请注明出处 —— polobymulberry-博客园 1.SDWebImageDownloader中的downloadImageWithURL 我们 ...