Ask HN: JavaScript in server-rendered webapps

1 point·bizon··4 comments

How do you structure the JS code in server rendered webapps? How do you structure pjax code? I'm wondering also if there's an open source project I can take a look at.

View on HN

All my recent projects use the same foundation for server-side rendering, which seems to be a common way people are doing it: React/Preact to organize view components, with a Node.js server importing the same frontend code to match URL routes and render to string. This library has some examples: https://github.com/developit/preact-render-to-string

Perhaps I wasn't clear about it. I don't want to use react or angular, just jquery and other small libraries or components

Oh I see, should have noticed when you said pjax. I imagine some concepts will be applicable in any case, like:

- URL routing on both client/server: for navigation without page reload, as well as rendering the same content when the user lands on a particular page for the first time (or refreshes the page)

- Templates on both client/server: maybe you could share the same HTML (or Mustache, Pug, etc.) templates on both sides

- Passing initial state from server -> client: typically, a JS snippet can be injected in a page template to pass an object, so the client-side can sync the state (initial route, etc.)

- Dynamic loading of additional scripts: some routes may request additional scripts via AJAX/fetch, in which case a small library/wrapper may be useful, to know when it finished loading to do something

http://intercoolerjs.org/ maybe?

Reply on news.ycombinator.com