这是我参与「第五届青训营」伴学笔记创作活动的第七天
一、本堂课重点内容
- CSR,SSR,SSG
- 什么是Next.js
- Next.js客户端开发
- Next.js服务端开发
- 核心功能讲解
二、详细知识点介绍
- next.js是具备C端Web应用开发
- CSR是客户端渲染，SSR是服务器渲染，SSG静态站点生成。
- SSR/SSG只需要请求一个HTML文件就能展现出页面，不需要请求大量的js文件，可以拥有更短的首屏时间。
- Next.js是一个构建于Node.js之上的开源Web开发框架，支持基于React的Web应用程序功能。
三、课后个人总结
Next.js是基于react框架，Nuxt.js是基于Vue框架。因为最近是在学nuxt3，对于next.js不是很了解，在学习nuxt3的过程中，发现nuxt3与vue3几乎是差不多的，就路由用起来更舒服了，比如动态路由，嵌套路由，数据获取也方便许多，有四个获取方式：useAsyncDate，useLazyAsyncData,useFetch,useLazyFetch。还有个SSR友好的跨组件共享状态，比用自定义属性，自定义事件，还有写个.js文件来在组件与组件之间传输数据更加方便，简洁。
四、课后补充
CSR的利处：网络传输数据量小、减少了服务器压力、前后端分离、局部刷新，无需每次请求完整页面、交互好实现各种效果。
CSR的弊处：不利于SEO、爬虫看不到完整的程序源码、首屏渲染慢
SSR的益处：首屏渲染快、利于SEO、可以生成缓存片段，生成静态化文件、节能
SSR的弊处：用户体验交叉、不容易维护，通常前端改了部分html或者css，后端也需要修改代码。
同构的条件：通过应用的路由匹配，找到具体的页面，不同的页面有不同的视图。必须实现客户端与服务端的路由、模型组件、数据模型的共享。
