服务端渲染详解（SSR）

2024-05-12 06:50:41

综述：知识扩展，深化认识

1.服务端渲染产生背景介绍

自从SPA（单页面应用）诞生后，其顺滑的用户体验让大家趋之若鹜，但由此也产生了两个问题：

由于其是在浏览器端完成了页面的路由控制，不利于网站的SEO（搜索引擎优化）。
由于在第一次加载的过程中，就将页面所有的内容加载过来，所以TTFE（首屏白屏问题）问题严重，使用户体验不好

为了解决这两个问题，就产生了服务端渲染，相当于在服务端和客户端再增加一层node中间层，由node层进行数据的获取并将其注入到html中，产生一个html文件，发送给前端浏览器，浏览器直接渲染；

2.Vue服务端渲染框架NUXT.js介绍

官方介绍：https://zh.nuxtjs.org/guide

Nuxt.js 是一个基于 Vue.js 的通用应用框架。

通过对客户端/服务端基础架构的抽象组织，Nuxt.js 主要关注的是应用的 UI渲染。

我们的目标是创建一个灵活的应用框架，你可以基于它初始化新项目的基础结构代码，或者在已有 Node.js 项目中使用 Nuxt.js。

Nuxt.js 预设了利用Vue.js开发服务端渲染的应用所需要的各种配置。

除此之外，我们还提供了一种命令叫：nuxt generate，为基于 Vue.js 的应用提供生成对应的静态站点的功能。

我们相信这个命令所提供的功能，是向开发集成各种微服务（microservices）的 Web 应用迈开的新一步。

作为框架，Nuxt.js 为 客户端/服务端 这种典型的应用架构模式提供了许多有用的特性，例如异步数据加载、中间件支持、布局支持等。

3.React服务端渲染框架NEXT.js介绍

next.js官方资料：https://nextjs.org/learn/

next.js参考资料：https://juejin.im/entry/59791d8f6fb9a03c391b557e

------未完待续

服务端渲染详解（SSR）相关推荐

Nuxt SSR 服务端渲染详解
Nuxt SSR 服务端渲染详解 1.Nuxt项目构建 2.Nuxt的生命周期 2.1 nuxtServerInit 钩子 2.2 middleware 中间件 2.3 validate 数据校验 ...
NodeJS+Express+mySQL服务端开发详解
NodeJS+Express+mySQL服务端开发详解随着NodeJS的发展,现在已经被很多人熟知,NodeJS已经成为了前端开发人员必备的技能.本文不会对NodeJS过多介绍如果你感兴趣可以访问 ...
我的世界服务器怎么找到指定路径,[小白]MC服务端目录详解
服务器的前期准备工作都做好了,是时候上传服务端到服务器了.不过--先等等,在上传前你应该先了解一下服务端目录的结构以便于后期的维护! 如图所示的是MCPC+1.6.4的服务端结构示意图,其他开服端基本 ...
使用KBEngine开发UE4服务端——开发详解
使用KBEngine开发UE4服务端--开发详解 1. 简述开始正式进入开发,网络上关于开发和修改文件的文章较少,这里会记录自己开发过程中需要更改的地方和一些流程. 2. 前期的配置说明根据前文配 ...
我很懒,什么都没留下系列之教你上手React服务端渲染（React SSR） HMR
技术栈:webpack3.9.1+webpack-dev-server2.9.5+React16.x + express4.x 前言 (好慌!可能是因为我很懒,导致...,然后,好吧,我比较懒,没有然 ...
实现 Vue 服务端渲染（Vue SSR）
什么是服务端渲染(SSR)? Vue.js 是构建客户端应用程序的框架,但是也可以将同一个组件渲染为服务端的 HTML 字符串,将它们直接发送到浏览器,最后将这些静态标记"激活"为 ...
QT中使用C++ socket通信，socket通信原理三次握手和四次握手详解、客户端与服务端实例详解
对TCP/IP.UDP.Socket编程这些词你不会很陌生吧?随着网络技术的发展,这些词充斥着我们的耳朵.那么我想问: 1. 什么是TCP/IP.UDP? 2. Soc ...
mysql5.7只安装服务端_Windows Mysql5.7.11 服务端安装详解
MySQL服务端安装过程主要是选择安装类型(自定义.典型和完整版),一般我都会选择自定义主要是为了安装到指定目录上,此过程省略,下面着重记录配置过程. 1.配置my.ini文件在解压的目录下面复制m ...
Kafka服务端脚本详解(2)一log,verifiable
2019独角兽企业重金招聘Python工程师标准>>> 脚本名称脚本用途 kafka-log-dirs.sh 查看指定broker上日志目录使用情况 kafka-verifiabl ...

最新文章

热门文章