I got a crazy idea this morning.<p>What if there was middle-man (CDN, proxy, etc) that sits between the browser and the target service and, for each page request, it would act as a headless browser, visiting the target page, running all the JS and doing the rendering, and then dumping the DOM tree to HTML and serving it to the client (with zero JS)?<p>So the target app could be 100% JS-rendered but it'd look to the browser as though it's just a static HTML page.<p>(I know that the question then is "doesn't it mean that the website would end up not being interactive because the JS doesn't get delivered to the browser?", but I imagine use cases when it's not really a concern)<p>Is there any project on the Web that does anything remotely similar to this idea? The core thing is using a headless browser to do all the JS-initiated rendering on the server before the content hits the browser.
As a side note, I can imagine this approach being used for a customer-facing "proxy server".<p>E.g. there are people who disable JS by default and enable it for the websites they trust or when the page is completely dead without running JS.<p>I imagine an improved "Disable JS" function that (1) makes sure your browser doesn't run any JS but (2) ships a normally rendered page.
I am currently developing kind of what you're looking for! <a href="https://browser.staging.jimber.io" rel="nofollow">https://browser.staging.jimber.io</a>
You can interact with the browser on the backend (the headless one). But we could take out the 'small' part that renders the webpage in it's inital stage
I think basecamp is working on this kind of technology, but I think it is somewhat common for some performance focused shops to pre-render their initial HTML and cache it in their load balancer.<p>Basecamp I think is taking it a step further.. read more here: <a href="https://hotwired.dev/" rel="nofollow">https://hotwired.dev/</a>
Is Mighty Browser (<a href="https://www.mightyapp.com/" rel="nofollow">https://www.mightyapp.com/</a>) what you are looking for?