SPA, SEO, SSR总结

SPA单页面Web应用

SPA(Single page web application) 单页面Web应用

Web不再是一张张页面,而是一个整体的应用,一个由路由系统,数据系统,页面(组件)系统等等,组成的应用程序, 让用户不需要每次与服务器进行页面刷新来获得新的内容, 从而提供了更快,跟流畅的用户体验, 在SPA中, 所有的交互都在一个单独的页面中进行处理, 通常时index.html, 通过JavaScript和Ajax技术动态地加载内容和更新页面,同时使用前端路由管理页面的不同状态和页面之间的跳转。

SPA应用广泛用于对SEO要求不高的场景

SEO搜索引擎优化

SEO (Search Engine Optimization) 搜索引擎优化

通过各种技术(手段)来确保, 我们的Web内容被搜索引擎最大化收录,最大化提高权重,最终带来更多流量, 常见的SEO技术包括, 优化网站的关键词, 标题, 和描述, 改善网站的内部连接结构, 增加网站的页面访问速度, 提高网站的用户体验, 建立高质量的外部链接等

SSR服务端渲染

SSR (Server Side Render) 服务端渲染, 即网页是通过服务端渲染生成后输出给客户端

在SSR中, 前端分为两部分: 前端客户端, 前端服务端

                前端服务端, 用于发送AJAX, 获得数据

                前端客户端, 用于将AJAX数据和页面进行渲染, 渲染成HTML页面, 并相应给调用程序(浏览器,爬虫)

如果爬虫获得html页面, 就可以启动处理程序, 处理页面内容, 做种完成SEO操作

SPA和SSR对比

SPA单页应用程序SSR服务器端渲染
优势1.页面内容在客户端渲染 2. 只关注View层,与后台耦合度低,前后端分离 3.减轻后台渲染画面的压力1.更好的SEO,搜索引擎工具可以直接查看完全渲染的画面 2.更快的内容到达时间 (time-to-content),用户能更快的看到完整渲染的画面
劣势1.首屏加载缓慢 2.SEO(搜索引擎优化)不友好1.更多的服务器端负载 2.涉及构建设置和部署的更多要求,需要用Node.js渲染 3.开发条件有限制,一些生命周期将失效 4.一些常用的浏览器API无法使用

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/258301.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

文献速递:多模态影像组学文献分享:多模态图注意力网络用于COVID-19预后预测

文献速递:多模态影像组学文献分享:多模态图注意力网络用于COVID-19预后预测 01 文献速递介绍 在处理像 COVID-19 这样的新出现的疾病时,患者和疾病特定因素(例如,体重或已知共病)对疾病的即时进展的影响…

swiftUi——颜色

在SwiftUI中,您可以使用Color结构来表示颜色。Color可以直接使用预定义的颜色,例如.red、.blue、.green等,也可以使用自定义的RGB值、十六进制颜色代码或者系统提供的颜色。 1. 预定义颜色 Text("预定义颜色").foregroundColor(.…

【模型量化】神经网络量化基础及代码学习总结

1 量化的介绍 量化是减少神经网络计算时间和能耗的最有效的方法之一。在神经网络量化中,权重和激活张量存储在比训练时通常使用的16-bit或32-bit更低的比特精度。当从32-bit降低到8-bit,存储张量的内存开销减少了4倍,矩阵乘法的计算成本则二…

运行时更改Android应用程序图标

设想一下,当我们正在开发一款应用。随着某个节日的临近,我们可能希望通过更改应用图标来增强用户的节日氛围,例如在图标上添“新年特惠”或者“龙年大吉”等标签。 这种小小的改变看似不经意,却能够吸引用户的注意。 运行时更改应…

网安领域含金量最高的证书有哪些?看这1篇就足够了!

文章目录 一、前言二、CISP三、CISAW四、NISP五、为什么很多人考不下来 一、前言 现在想找网络安全之类的工作,光有技术是不够的,还得有东西证明自己,网安三大敲门砖:CTF、漏洞证明和专业证书。 对于CTF的话只是少数人能参加的&…

Redis保证高可用的三种方式

Redis保证高可用主要有三种方式:主从、哨兵、集群。 主从复制了解吗? Redis主从复制简图 主从复制,是指将一台 Redis 服务器的数据,复制到其他的 Redis 服务器。前者称为 主节点(master),后者称为 从节点(slave)。且…

html、css类名命名思路整理

开发页面时,老是遇到起名问题,越想越头疼,严重影响开发进度,都是在想名字,现在做一下梳理,统一一下思想,希望以后能减少这块的痛苦。 命名规则 [功能名称]__[组成部分名称]--[样式名称] 思路…

C语言数组(下)

我希望各位可以在思考之后去看本期练习,并且在观看之后独立编写一遍,以加深理解,巩固知识点。 练习一:编写代码,演⽰多个字符从两端移动,向中间汇聚 我们依旧先上代码 //编写代码,演⽰多个字…

C //例10.3 从键盘读入若干个字符串,对它们按字母大小的顺序排序,然后把排好序的字符串送到磁盘文件中保存。

C程序设计 (第四版) 谭浩强 例10.3 例10.3 从键盘读入若干个字符串,对它们按字母大小的顺序排序,然后把排好序的字符串送到磁盘文件中保存。 IDE工具:VS2010 Note: 使用不同的IDE工具可能有部分差异。 代码块 方法…

HttpComponents: 领域对象的设计

1. HTTP协议 1.1 HTTP请求 HTTP请求由请求头、请求体两部分组成,请求头又分为请求行(request line)和普通的请求头组成。通过浏览器的开发者工具,我们能查看请求和响应的详情。 下面是一个HTTP请求发送的完整内容。 POST https://track.abc.com/v4/tr…

c语言怎么“简单”表示9个变量互不相等?

c语言怎么“简单”表示9个变量互不相等? 在开始前我有一些资料,是我根据自己从业十年经验,熬夜搞了几个通宵,精心整理了一份「C语言从专业入门到高级教程工具包」,点个关注,全部无偿共享给大家!&#xff0…

第二次上机测试:Javascript. (第一组)

需求:(注意在规定的时间,在自己的博客提交作品,便于统计测试的完成情况。博客题目《第二次上机测试:Javascript.》) 1、点击按钮,将图片加上边框 2、点击按钮,将图片缩小为长和宽都…