react-router-server - Server Side Rendering library for React Router v4.

•    Javascript

---

Server Side Rendering library for React Router v4. If anyone is interested in taking over this project please let me know.

webpack2 react-router code-splitting server-side-rendering ssr react reactjs react-component webpack server

react-ssr-optimization - React

•    Javascript

---

React server-side rendering optimization with component memoization and templatization

react-server server-optimization rendering-optimizations component-memoization html-markup isomorphic universal-react optimization react-server-render react-rendering react server-side memoization templatization cache caching

fastify - Fast and low overhead web framework, for Node.js

•    Javascript

---

Enter Fastify. Fastify is a web framework highly focused on providing the best developer experience with the least overhead and a powerful plugin architecture. It is inspired by Hapi and Express and as far as we know, it is one of the fastest web frameworks in town. Do you want to know more? Head to the Getting Started.

webframework performance speed nodejs web framework json schema open api

rendora - dynamic server-side rendering using headless Chrome to effortlessly solve the SEO problem for modern javascript websites

•    Go

---

Rendora can be seen as a reverse HTTP proxy server sitting between your backend server (e.g. Node.js/Express.js, Python/Django, etc...) and potentially your frontend proxy server (e.g. nginx, traefik, apache, etc...) or even directly to the outside world that does actually nothing but transporting requests and responses as they are except when it detects whitelisted requests according to the config. In that case, Rendora instructs a headless Chrome instance to request and render the corresponding page and then return the server-side rendered page back to the client (i.e. the frontend proxy server or the outside world). This simple functionality makes Rendora a powerful dynamic renderer without actually changing anything in both frontend and backend code. Dynamic rendering means that the server provides server-side rendered HTML to web crawlers such as GoogleBot and BingBot and at the same time provides the typical initial HTML to normal users in order to be rendered at the client side. Dynamic rendering is meant to improve SEO for websites written in modern javascript frameworks like React, Vue, Angular, etc...

ssr react vue angular reactjs vuejs chrome-headless chrome-devtools seo seo-optimization server-side-rendering dynamic-rendering spa crawler puppeteer

loadable-components - React code splitting made easy ✂️✨

•    Javascript

---

React code splitting made easy. Reduce your bundle size without stress ✂️✨. Webpack allows modern code splitting via the dynamic import syntax. Loadable Components makes it possible to use that awesome feature with React. It is compatible with react-router and server side rendering. The API is designed to be as simple as possible to avoid useless complexity and boilerplate.

react ssr webpack code-splitting react-router server-side-rendering dynamic-import react-loadable react-async-component react-async-components

permit - An unopinionated authentication library for building Node.js APIs.

•    Javascript

---

An unopinionated authentication library for building Node.js APIs. Permit makes it easy to add an authentication layer to any Node.js API. It can be used with any of the popular server frameworks (eg. Express, Koa, Hapi, Fastify) and it can be used for any type of API (eg. REST, GraphQL, etc.) due to its simple, unopinionated design.

nodejs authentication express koa hapi fastify api auth authn authorization bearer fastly graphql header oauth passport request rest server token

rapscallion - Asynchronous React VirtualDOM renderer for SSR.

•    Javascript

---

This function returns a Renderer, an interface for rendering your VirtualDOM element. Methods are enumerated below.This function evaluates the React VirtualDOM Element originally provided to the renderer, and returns a Promise that resolves to the component's evaluated HTML string.

react server-side-rendering react-dom asynchronous stream html render ssr

electrode-react-ssr-caching - Optimize React SSR with profiling and component caching

•    Javascript

---

Support profiling React Server Side Rendering time and component caching to help you speed up SSR. Note that since this module patches React's source code to inject the caching logic, it must be loaded before the React module.

react-no-ssr - React component to wrap non SSR friendly components

•    Javascript

---

React component to wrap non SSR components. When working with Server Side Rendering(SSR) enabled apps, you have to deal with client only components. This wrapper makes it simple to work with those components.

reactql - Universal React+GraphQL starter kit: React 16, Apollo 2, Webpack 4, Styled Components 4, React Router 4, PostCSS, SSR

•    TypeScript

---

Universal front-end React + GraphQL starter kit, written in Typescript. Hot code reloading. Make a change anywhere in your code base (outside of the Webpack config), and changes will be pushed down the browser automatically - without page reloads. This happens for React, Styled Components, SASS - pretty much anything.

react webpack starter-kit postcss ssr reactjs apollo apollo-client graphql webpack4 styled-components typescript hot-reload helmet sass less gzip brotli server-side-rendering universal

react-app - Create React apps with server-side rendering and no build configuration

•    Javascript

---

Then open http://localhost:3000/ to see your app. When you’re ready to deploy to production, create a minified bundle with npm run build.

react reactjs server-side-rendering ssr webpack babel isomorphic single-page-app boilerplate template

react-async-component - Resolve components asynchronously, with support for code splitting and advanced server side rendering use cases

•    Javascript

---

Resolve components asynchronously, with support for code splitting and advanced server side rendering use cases. This library does not require that you use either Webpack or Babel. Instead it provides you a generic and "pure" Javascript/React API which allows for the expression of lazy-loaded Components. It's Promise-based API naturally allows you to take advantage of modern code splitting APIs (e.g import(), System.import, require.ensure).

async-component react code-splitting webpack ssr asynchronous component

isomorphic-relay - Adds server side rendering support to React Relay

•    Javascript

---

Enables server-side rendering of React Relay containers. If you use react-router-relay you might also become interested in isomorphic-relay-router.

relay isomorphic-relay isomorphic isomorphic-react-relay react react-relay server server-rendering server-side server-side-rendering

universal-router - A simple middleware-style router for isomorphic JavaScript web apps

•    Javascript

---

A simple middleware-style router that can be used in both client-side (e.g. React, Vue.js) and server-side applications (e.g. Node.js/Express, Koa).Play with an example on JSFiddle, CodePen, JS Bin in your browser or try RunKit node.js playground.

react reactjs routing router routes spa single-page-app ssr server-side-rendering vuejs react-component route flux

isomorphic-flux-boilerplate - ES7 Isomorphic Flux/ReactJS Boilerplate

•    Javascript

---

A wonderfull boilerplate for Flux/ReactJS universal applications, running on koajs. Koa will be our server for the server side rendering, we use alt for our Flux architecture and react-router for routing in our app.

react flux alt iso isomorphic spa ssr koa webpack jsx es6 babel postcss precss eslint react-router react-transform-hmr react-transform hot-loader async server generator es7 i18n intl

symfony-react-sandbox - Example of integration with React and Webpack (Webpack Encore) for universal (isomorphic) React rendering, using Limenius/ReactBundle and Limenius/LiformBundle

•    Javascript

---

This sandbox provides an example of usage of ReactBundle with server and client-side React rendering (universal/isomorphical) and its integration with a fitting Webpack Encore setup. It also provides an example of the usage of LiformBundle to generate a json-schema from Symfony forms and a forms and validation in React from that schema. -Note: If you are new to React.js, please note that this sandbox or the bundle are not by any means required to use React with Symfony. This shocases how to do some advanced features such as Server Side Rendering, a better integration with forms, injecting components directly from Twig tags, that may be difficult.

symfony react webpack json-schema webpack-encore jsx reactjs server-side rendering isomorphic

After.js - Next.js-like framework for server-rendered React apps built with React Router 4

•    Javascript

---

Next.js is awesome. However, its routing system isn't for me. IMHO React Router 4 is a better foundation upon which such a framework should be built. Routes are just components and don't / should not have anything to do with folder structure. Static route configs are fine.

react server-side-rendering ssr webpack react-router

crate - 👕👖📦 A sample web and mobile application built with Node, Express, React, React Native, Redux and GraphQL

•    Javascript

---

👕👖📦 A sample web and mobile application built with Node, Express, React, React Native, Redux and GraphQL. Very basic replica of stitchfix.com / krate.in (allows users to get monthly subscription of trendy clothes and accessories).

nodejs graphql express sequelize mysql jwt react redux ssr server-side-rendering react-native android ios seo-friendly es6 babel webpack adobe-xd web-application mobile-application

react-server-example - A simple example of how to do server-side rendering with React (no compilation needed)

•    Javascript

---

A simple (no compile) example of how to do server-side rendering with the React library so that component code can be shared between server and browser, as well as getting fast initial page loads and search-engine-friendly pages.A more complex example with shared routing and data fetching can be found at react-server-routing-example.

react reactjs server server-side

ssr-with-prepack-hackathon - ReactDOMServer + experimental Prepack (React) compiler

•    Javascript

---

Around two weeks ago, as part of a 2 day hackathon, I wanted to see if it was possible to build on top of our work on Prepack and ahead-of-time compile a React app, optimized for server-side rendering only. My goal was to see if it was possible to eliminate React completely from the bundle and generate a simple JS file with the minimal logic necessary to render the HTML. To keep my scope for this hackathon small, I aimed solely to get on getting our existing Hacker News benchmark, written in React, to have 100% the same HTML output the non-compiled version generates.