文件名称:Prerender-SPA:SPA单页面-预渲染应用实践
文件大小:338KB
文件格式:ZIP
更新时间:2024-05-28 14:35:21
spa preprende JavaScript
使用 npm install 下载依赖 npm run dev 启动客户端服务 npm run build 生成预渲染页面 npm run serve 开启http-server服务,监控生成的dist目录 npm run node 开启Koa服务,监控生成的dist目录 指南 预渲染原理 在webpack打包结束并生成文件后(after-emit hook),会启动一个server模拟网站的运行,用puppeteer(google官方的headless 无头浏览器浏览器)访问指定的页面route,得到相应的html结构,并将结果输出到指定目录,过程类似于爬虫。 预渲染应用场景 seo优化 对于一些动态数据利用enderAfterTime也可以进行预渲染出来。当动态数据渲染出来之后,客户端代码比如bundle.js会立马接管dom操作。对于spa优化可谓是非常方便。 对于meta
【文件预览】:
Prerender-SPA-master
----index.html(175B)
----webpack.config.js(3KB)
----favicon.ico(32KB)
----src()
--------main.js(781B)
--------components()
--------App.vue(889B)
--------assets()
----.babelrc(38B)
----serve.js(771B)
----README.md(6KB)
----dist()
--------index.html(980B)
--------about()
--------favicon.ico(32KB)
--------build.js(126KB)
--------build.js.map(632KB)
--------logo.png(7KB)
--------contact()
----.gitignore(14B)
----package-lock.json(356KB)
----package.json(1013B)