{"id":16728367,"url":"https://github.com/tmc/reactssr","last_synced_at":"2025-08-11T20:31:19.050Z","repository":{"id":54641573,"uuid":"335817923","full_name":"tmc/reactssr","owner":"tmc","description":"reactssr is a package for rendering React applications.","archived":false,"fork":false,"pushed_at":"2023-09-11T03:46:37.000Z","size":240,"stargazers_count":102,"open_issues_count":3,"forks_count":9,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-12-01T10:23:36.095Z","etag":null,"topics":["go","react"],"latest_commit_sha":null,"homepage":"","language":"Go","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tmc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-02-04T02:41:37.000Z","updated_at":"2024-06-03T12:53:41.000Z","dependencies_parsed_at":"2024-06-19T01:34:53.687Z","dependency_job_id":"6b02bc79-4915-48dd-baa7-3ea59f21355a","html_url":"https://github.com/tmc/reactssr","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tmc%2Freactssr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tmc%2Freactssr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tmc%2Freactssr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tmc%2Freactssr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tmc","download_url":"https://codeload.github.com/tmc/reactssr/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":229586761,"owners_count":18096678,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["go","react"],"created_at":"2024-10-12T23:10:03.615Z","updated_at":"2024-12-13T18:34:41.501Z","avatar_url":"https://github.com/tmc.png","language":"Go","funding_links":[],"categories":[],"sub_categories":[],"readme":"# reactssr\n\nA Go package to perform Server Side Rendering of React apps.\n\n[![Project status](https://img.shields.io/github/release/tmc/reactssr.svg?style=flat-square)](https://github.com/tmc/reactssr/releases/latest)\n[![Build Status](https://github.com/tmc/reactssr/actions/workflows/test.yml/badge.svg)](https://github.com/tmc/reactssr/actions/workflows/test.yml)\n[![Go Report Card](https://goreportcard.com/badge/tmc/reactssr?cache=0)](https://goreportcard.com/report/tmc/reactssr)\n[![go.dev reference](https://img.shields.io/badge/go.dev-reference-007d9c?logo=go\u0026logoColor=white\u0026style=flat-square)](https://pkg.go.dev/github.com/tmc/reactssr)\n\n## Example usage\n\nGiven a bundle produced from an additional entrypoint to your application such as [js/index.ssr.jsx](./js/index.ssr.jsx):\n\n```jsx\n\nimport * as React from 'react';\nimport * as Server from 'react-dom/server'\nimport './index.css';\nimport App from './App';\n\nconst AppOutput = Server.renderToString(\n  \u003cReact.StrictMode\u003e\n    \u003cApp /\u003e\n  \u003c/React.StrictMode\u003e\n);\n\n// reactssr.render is the callback injected by the go runtime to pass the rendered application back.\nreactssr.render(AppOutput);\n```\n\nThis file should be bundled, for example, with [esbuild](https://esbuild.github.io/) as so:\n\n```bash\nnpx esbuild \\\n   src/index.ssr.jsx \\\n   --inject:src/react-shim.js \\\n   --bundle \\\n   --sourcemap \\\n   --outfile=build/out.js \\\n   --loader:.js=jsx \\\n   --loader:.svg=text \\\n   --define:process.env.NODE_ENV=\\\"production\\\"\n```\n\nThen the following code will execute the bundle and load the results into a Go variable (for serving\nto a client, for emple).\n\n```go\nr, _ := reactssr.NewServerSideRenderer(\"./testdata/test-app-1/build/out.js\")\noutput, _ := r.Render()\n\n// output contains the rendered html from the React application.\n```\n\n## How this works\n\n`reactssr` works by executing a React application bundle with `reactssr.render` injected into the\nglobal Javascript namespace.\n\nIn this example:\n\n```js\nreactssr.render(Server.renderToString(\n  \u003cReact.StrictMode\u003e\n    \u003cApp /\u003e\n  \u003c/React.StrictMode\u003e\n));\n```\n\n`reactssr.render` is a Go callback which allows the Javascript execution environment to pass\nthe rendered HTML and CSS between runtimes.\n\n\n## Performance\n\nThis package includes benchmarks which are run in CI: [reactssr_test.go](./reactssr_test.go).\n\n[Recent performance results](https://github.com/tmc/reactssr/runs/1828170002?check_suite_focus=true)\n\n```sh\ngo test -v -run=XXX -benchmem -bench=.*\ngoos: linux\ngoarch: amd64\npkg: github.com/tmc/reactssr\nBenchmarkRender\nBenchmarkRender-2    \t     464\t   5855720 ns/op\t    3459 B/op\t      19 allocs/op\nPASS\n```\n\nThis indicates that it takes just under `6 milliconds` to render the current default output \nfrom [create-react-app](https://github.com/facebook/create-react-app). This is without any specific \nwork towards optimizing the implementation and this output is easily cachable.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftmc%2Freactssr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftmc%2Freactssr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftmc%2Freactssr/lists"}