Live data from Hacker News

Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

github.com

11–20 of 24 posts

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#11
post #2

Hello HN, I've been developing and testing rendora for some time now and decided to put it publicly today on github, I would love to take feedbacks or answer any question!

How do you test that it works when there is no display in headless chrome?

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#13

So, Rendora is comparable with https://prerender.io ?

* prerender.io is a paid service; Rendora is FOSS and self hosted

* prerender.io needs additional code in your backend to filter requests and asks for SSR from a remote server then returns back the resulting HTML; Rendora doesn't because it does all that automatically by being a lightweight reverse HTTP proxy server in front of your backend

* with Rendora you can control caching (using an internal local store or Redis), prerender.io claims caching on their servers I guess but then you can't control it espcially if you have fast chaing pages

* Rendora provides Prometheus metrics to measure your SSR latencies, count of cached and uncached requests and an API rendering endpoint

* Rendora supports asynchronous pages where content is loaded after the initial DOM load

* you can simply choose which Chrome version you want to use with Rendora

* Rendora instructs headless Chrome to skip fetching unncessary assets (e.g. fonts, CSS, images, etc...) which makes the DOM load much faster then when loaded and rendered by default

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#14
post #2

Hello HN, I've been developing and testing rendora for some time now and decided to put it publicly today on github, I would love to take feedbacks or answer any question!

How do you test that it works when there is no display in headless chrome?

you can add your user agent to whitlested user agents or (less recommended) you can even connect to the headless chrome instance (usually using http://localhost:9222 but in that case I remind you that some assets are blocked from being fetched by default such as images, fonts and CSS to speed up the DOM load. This doesn't affect the resulting HTML.)

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#15

What's the disadvantage or advantage of headless chrome over chrome with head intact? Is headless chrome faster? Can we control popup windows in headless one? Does it support proxies? Is it possible to control tabs? Close and open in new tab etc...

>What's the disadvantage or advantage of headless chrome over chrome with head intact?

I am not aware of any. You just don't use headless Chrome for typical browsing :D

>Is headless chrome faster?

I guess it slightly is, because it doesn't need to paint the rendered page but tbh Chrome/Chromium is an enormous project so I can't comment in details.

>Can we control popup windows in headless one? >Does it support proxies?

I believe they are not possible because chrome-devtools-protocol doesn't support that yet, but you can add http/socks proxies inside Chrome and then run it as headless to use a proxy if you insist

> Is it possible to control tabs? yes

if you're that interested about headless Chrome, I recommend you read about chrome devtools protocol https://chromedevtools.github.io/devtools-protocol/1-2

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#16
post #9
post #8

So a regular browser will receive a js bundle, but a crawler will recieve a html page? How does Rendora determine which version to give the requester? Is it the "User Agent String"?

No, both receive HTML, the real problem is that websites built with modern javascript frameworks (e.g. react, vue, angular, etc...) render most of the content using the javascript engine in browsers, search engines don't execute javascript and thus they see almost nothing but a header and almost an empty body (of course it depends on your use case to be more accurate). Rendora solves the SEO problem for such websites…

So if I'm hearing correctly, if a User Agent is white-listed it Rendora will render the page on the server and return less assets (no CSS, fonts etc)

If it's not white-listed it will just let the request pass through normally to the server (eg static file server) is this correct?

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#17
post #16
post #9

Earlier quoted context omitted.

No, both receive HTML, the real problem is that websites built with modern javascript frameworks (e.g. react, vue, angular, etc...) render most of the content using the javascript engine in browsers, search engines don't execute javascript and thus they see almost nothing but a header and almost an empty body (of course it depends on your use case to be more accurate). Rendora solves the SEO problem for such websites…

So if I'm hearing correctly, if a User Agent is white-listed it Rendora will render the page on the server and return less assets (no CSS, fonts etc) If it's not white-listed it will just let the request pass through normally to the server (eg static file server) is this correct?

>and return less assets (no CSS, fonts etc)

no, it returns the whole page, it's just equivalent to rendering pages on your browser, everything in the initial HTML is the same in addition to HTML generated by javascript frameworks added to the DOM after the webapp scripts are loaded.

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#18
post #17
post #16

Earlier quoted context omitted.

So if I'm hearing correctly, if a User Agent is white-listed it Rendora will render the page on the server and return less assets (no CSS, fonts etc) If it's not white-listed it will just let the request pass through normally to the server (eg static file server) is this correct?

>and return less assets (no CSS, fonts etc) no, it returns the whole page, it's just equivalent to rendering pages on your browser, everything in the initial HTML is the same in addition to HTML generated by javascript frameworks added to the DOM after the webapp scripts are loaded.

Okay, so it renders the javascript webapp (Angular/React/Vue) on the fly into HTML, (just as it would appear in a client's browser), but only for the whitelisted UserAgents, which can be crawlers right?

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#19
post #18
post #17

Earlier quoted context omitted.

>and return less assets (no CSS, fonts etc) no, it returns the whole page, it's just equivalent to rendering pages on your browser, everything in the initial HTML is the same in addition to HTML generated by javascript frameworks added to the DOM after the webapp scripts are loaded.

Okay, so it renders the javascript webapp (Angular/React/Vue) on the fly into HTML, (just as it would appear in a client's browser ), but only for the whitelisted UserAgents, which can be crawlers right?

yes exactly :), as if crawlers see exactly the same HTML of what browsers see after DOM load not the initial incomplete HTML sent by servers

Re: Show HN: Rendora – Dynamic server-side rendering for modern JavaScript websites

#20
Cool idea and implementation.

Question: If the “initial render” of client side code involves JavaScript mounting nodes on the DOM, how is this transformed into static HTML that can be rendered without JavaScript? Does headless chrome offer a way to “snapshot” the DOM in its current state (basically like copy pasting the “elements” pane in dev tools)? Just wondering if there is a term for this, and/or where it’s documented.

Post reply on HN