Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FEATURE] Added default Rendertron support #3058

Closed
wants to merge 2 commits into from

Conversation

lewisvoncken
Copy link
Contributor

@lewisvoncken lewisvoncken commented Mar 14, 2021

Description

Many frontend frameworks rely on JavaScript to show content. This can mean Google might take some time to index your content or update the indexed content. One workaround option is to implement dynamic rendering. Dynamic rendering means switching between client-side rendered and pre-rendered content for specific user agents. This codelab will walk you through implementing dynamic rendering using Rendertron, which is an open source solution based on headless Chromium.

source: https://codelabs.developers.google.com/codelabs/dynamic-rendering#0

With 3 new environment variables you can easily setup Server Side Rendering with Rendertron.

  • RENDERTRON_URL
    Specify the Base URL of the Rendertron proxy service.
  • RENDERTRON_USER_AGENTS
    Regular expression to match user agent to proxy. Defaults to a set of bots that do not perform well with pages that require JavaScript.
  • RENDERTRON_EXCLUDE_URL_PATTERN
    Regular expression used to exclude request URL paths. Defaults to a set of typical static asset file extensions.

It is possible to self-host Rendertron or even refer to SeoSnap (https://seosnap.io/)

Acceptance

Verification Stakeholders

Specification

Verification Steps

  1. Add the following lines to your .env (important: in this example i use the appspot rendertron which shouldn't be used in production)
RENDERTRON_URL=https://localhost:3000/render
RENDERTRON_USER_AGENTS="PreCacher|SeoScan|SitemapCacheWarmer|Screaming|Mojolicious|googlebot|bingbot|yandex|Whatsapp|baiduspider|twitterbot|facebookexternalhit|rogerbot|linkedinbot|embedly|quora link preview|showyoubot|outbrain|pinterest|slackbot|vkShare|W3C_Validator|Lighthouse"
RENDERTRON_EXCLUDE_URL_PATTERN="graphql|\.(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|svg|eot)"
  1. Install Rendertron locally and run it on port 3000 or use https://render-tron.appspot.com/
  2. Switch the user-agent to for example googlebot and you should get a fully rendered page
  3. It is possible that you have to set closeBrowser in the rendertron configuration to true

image

Checklist

  • I have added tests to cover my changes, if necessary.
  • I have added translations for new strings, if necessary.
  • I have updated the documentation accordingly, if necessary.

Resolved issues:

  1. resolves [Issue] [FEATURE] Added default Rendertron support #3166: [FEATURE] Added default Rendertron support

@PWAStudioBot
Copy link
Contributor

PWAStudioBot commented Mar 14, 2021

Fails
🚫

node` failed.

🚫 A version label is required. A maintainer must add one.
🚫

No linked issue found. Please link a relevant open issue by adding the text "closes #<issue_number>" or "closes JIRA-<issue_number>" in your PR.

Messages
📖 DangerCI Failures related to missing labels/description/linked issues/etc will persist until the next push or next nightly build run (assuming they are fixed).
📖

Access a deployed version of this PR here. Make sure to wait for the "pwa-pull-request-deploy" job to complete.

Log

ERROR ON TASK: eslintCheck


Error:  Danger had errors running. See message(s) above for more details.
danger-results://tmp/danger-results.json

Generated by 🚫 dangerJS against 9f0aa3b

Copy link
Contributor

@jimbo jimbo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Very nice; thanks for your contribution, Lewis. Seems very straightforward, so I'd love to try this out.

package.json Outdated Show resolved Hide resolved
packages/upward-js/lib/createUpwardServer.js Outdated Show resolved Hide resolved
@lewisvoncken
Copy link
Contributor Author

@jimbo did you had time to check this PR?

@sirugh
Copy link
Contributor

sirugh commented May 7, 2021

@magento create issue from PR

@sirugh sirugh added the needs-triage A pull request or issue that needs to be triaged prior to being synced to JIRA label May 28, 2021
@tkacheva
Copy link
Contributor

@lewisvoncken thank you for submitting a PR! It took us a while to review it internally as we recognize the value Rendition can add to the product, but at the same time we want to make sure the pre-rendering mechanism added to the product works across all deployment models (on-prem and cloud). We start investigating the options internally and welcome you to contribute. Let me know if you are interested

@tkacheva tkacheva closed this Jun 10, 2021
@anthoula anthoula removed the needs-triage A pull request or issue that needs to be triaged prior to being synced to JIRA label Jul 25, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Partner: Experius partners-contribution pkg:pwa-buildpack pkg:upward-js Pertains to upward-js reference implementation of UPWARD.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Issue] [FEATURE] Added default Rendertron support
7 participants