prerender-tool
- Prerender util that generates html content ready to cache where you want ( redis / files / whatever).
- And can also create/maintain a sitemap.xml
This packages is build on top of
- puppeteer
It offers you a solid tool to crate a bin task using the power of js
Install
npm install prerender-tool
With your own chromium (optional):
add the two following files to your project:
├── ...├── .npmrc├── .env├── ...
in .npmrc
puppeteer_skip_chromium_download=true
in .env
PUPPETEER_EXECUTABLE_PATH='/path/to/your/own/bin/chrome'
then later in the constructor add executablePath in the browserOpts options:
...const prerender = await PrerenderTool...
Usage
render in redis
const PrerenderTool = run = async { //the class const prerender = await PrerenderTool // parse urls await prerender // and go sleep await prerender} // run code!
create sitemap.xml:
await prerender
cache as files:
const prerender = await PrerenderTool //import FileEngine first: { PrerenderTool, FileEngine } = require('prerender-tool')
configure nginx
pass options for npm-redis:
const prerender = await PrerenderTool
create provide urls then parse:
await prerenderawait prerender
do both in one:
await prerender
provide a good sitemap and customise your urls + pass chrome options
await prerender await prerender
Full Examples
Redis & Nginx
Install
npm i prerender-tool
Directory Structure
├── bin| └── prerender.js ├── dist ├── node_modules├── src├── README.md├── package.json└── .gitignore
bin/prerender.js
#!/usr/bin/env nodeconst PrerenderTool = moment = run = async { const prerender = await PrerenderTool await prerender await prerender // or build... await prerender process}
Build
bin/prerender.js
Nginx
redis with:
server { listen 443; server_name example.com; ssl on; ssl_certificate /etc/nginx/ssl/global_self_signed/global.crt; ssl_certificate_key /etc/nginx/ssl/global_self_signed/global.key; #logs off access_log off; log_not_found off; # root directive should be global root /data01/sites/example.com/dev/example.com/dist; index index.html; # such as .htaccess, .htpasswd, .DS_Store (Mac). location ~ /\. { deny all; } # Media: images, icons, video, audio, HTC location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|otf|ttf|eot|woff|woff2|svgz|mp4|ogg|ogv|webm|webp|htc)$ { expires 1M; access_log off; add_header Vary Accept-Encoding; add_header Cache-Control "public"; try_files $uri @rewrites; } ## All static files will be served directly. location ~* ^.+\.(?:css|cur|js|xml)$ { expires 1M; access_log off; add_header Vary Accept-Encoding; add_header Cache-Control "public"; try_files $uri @rewrites; } ## All other files location / { try_files $uri @prerender; } location @prerender { set $prerender 0; if ($http_user_agent ~* "googlebot|bingbot|yandex|baiduspider|facebookexternalhit|twitterbot|rogerbot|linkedinbot|embedly|bufferbot|quora link preview|showyoubot|outbrain|pinterest/0.|developers.google.com/+/web/snippet|www.google.com/webmasters/tools/richsnippets|slackbot|vkShare|W3C_Validator|redditbot|Applebot|WhatsApp|flipboard|tumblr|bitlybot|SkypeUriPreview|nuzzel|Discordbot|Google Page Speed|Qwantify") { set $prerender 1; } if ($args ~ "_escaped_fragment_") { set $prerender 1; } if ($http_user_agent ~ "Prerender") { set $prerender 0; } if ($uri ~ "\.(php|json|js|css|xml|less|png|jpg|jpeg|gif|pdf|doc|txt|ico|rss|zip|mp3|rar|exe|wmv|doc|avi|ppt|mpg|mpeg|tif|wav|mov|psd|ai|xls|mp4|m4a|swf|dat|dmg|iso|flv|m4v|torrent|ttf|woff)") { set $prerender 0; } # set redis settings "$host:" set $redis_key "$host:$request_uri"; if ($args) { set $redis_key "$host:$request_uri?$args"; } if ($prerender = 1) { # response header set $custom_response_header "text/html; charset=UTF-8"; redis_pass redis01.aws.3xw:6379; error_page 404 405 502 504 = @fallback; more_set_headers "Content-Type: $custom_response_header"; } try_files $uri $uri/ @rewrites; } #try vue location @rewrites { rewrite ^(.+)$ /index.html last; }}
File System & Nginx
Install
npm i prerender-tool
Directory Structure
├── bin| └── prerender.js ├── prerender
bin/prerender.js
#!/usr/bin/env nodeconst PrerenderTool FileEngine = moment = run = async { const prerender = await PrerenderTool await prerender await prerender // or build... await prerender process}
Build
bin/prerender.js
Nginx
TODO
Have fun 👌