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无法使用

相关推荐

  1. hive总结

    2023-12-11 23:12:05       62 阅读
  2. CSS总结

    2023-12-11 23:12:05       62 阅读
  3. HTML总结

    2023-12-11 23:12:05       59 阅读
  4. VIT<span style='color:red;'>总结</span>

    VIT总结

    2023-12-11 23:12:05      53 阅读
  5. 每日总结

    2023-12-11 23:12:05       62 阅读
  6. 每日总结

    2023-12-11 23:12:05       70 阅读
  7. webpack总结

    2023-12-11 23:12:05       63 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-11 23:12:05       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-11 23:12:05       106 阅读
  3. 在Django里面运行非项目文件

    2023-12-11 23:12:05       87 阅读
  4. Python语言-面向对象

    2023-12-11 23:12:05       96 阅读

热门阅读

  1. Qt12.11

    2023-12-11 23:12:05       65 阅读
  2. 二叉搜索树的最近公共祖先【数据结构】

    2023-12-11 23:12:05       48 阅读
  3. 647.回文子串

    2023-12-11 23:12:05       48 阅读
  4. Hough算法数学原理

    2023-12-11 23:12:05       48 阅读
  5. Flex布局 实现元素排列 4列变2列?

    2023-12-11 23:12:05       49 阅读
  6. 离线环境下安装python库(推荐pip download)

    2023-12-11 23:12:05       65 阅读
  7. 什么是https 加密协议?

    2023-12-11 23:12:05       61 阅读
  8. 什么是多态

    2023-12-11 23:12:05       52 阅读
  9. 我的Android播放器封装经验

    2023-12-11 23:12:05       52 阅读
  10. python扩展内置类型

    2023-12-11 23:12:05       61 阅读