{"id":19450959,"url":"https://github.com/rixo/rrs","last_synced_at":"2026-03-01T18:32:46.203Z","repository":{"id":147723994,"uuid":"272836045","full_name":"rixo/rrs","owner":"rixo","description":null,"archived":false,"fork":false,"pushed_at":"2020-06-16T23:53:09.000Z","size":2794,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-25T09:29:05.922Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":false,"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/rixo.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":"2020-06-16T23:52:16.000Z","updated_at":"2021-09-21T08:38:28.000Z","dependencies_parsed_at":"2023-04-03T14:49:24.870Z","dependency_job_id":null,"html_url":"https://github.com/rixo/rrs","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/rixo/rrs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rixo%2Frrs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rixo%2Frrs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rixo%2Frrs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rixo%2Frrs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rixo","download_url":"https://codeload.github.com/rixo/rrs/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rixo%2Frrs/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29978609,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-01T16:35:47.903Z","status":"ssl_error","status_checked_at":"2026-03-01T16:35:44.899Z","response_time":124,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":[],"created_at":"2024-11-10T16:39:42.340Z","updated_at":"2026-03-01T18:32:46.182Z","avatar_url":"https://github.com/rixo.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"# An attempt at building a svelte Application with filename hashing\n\n## usage\n\n```\nnpm install\nnpm run build:prod\nnpx serve build\n```\n\n## Goal\n\nAll javascript, css and asset outputs should contain a hash in their filename to provide for easy far future caching\n\n# Problems\n\n## index.html\n\nReferences js and css files, needs favicon and possibly other more data (title etv)\n\n\u003e ##### Solution\n\u003e\n\u003e Use an ejs based template and a rollup plugin that fills in information at build time\n\u003e\n\u003e see `tools/rollup-plugins/create-html.js`\n\n## .svelte `import` in script blocks\n\nimports can reference an asset, eg `import src from 'path/foo.png'`\nand we want `src` to be `output/foo~hash.png` in the build output\n\n\u003e ##### Solution\n\u003e\n\u003e Use rollup-plugin-smart-asset with a 'copy' configuration\n\u003e\n\u003e see `rollup.config.js`\n\n## .svelte style blocks `url()`\n\nstlye urls can reference an asset, eg `background-image: url('path/foo.png')`\nand we want it to be `background-image: url('output/foo~hash.png)` in the build output\n\n\u003e ##### Solution\n\u003e\n\u003e - Use `emitCss: true` in rollup-plugin-svelte\n\u003e - use postcss with rollup-plugin-postcss\n\u003e - postcss.config.js uses postcss-smart-asset with a similar configuration as rollup-plugin-smart-asset\n\u003e\n\u003e see `rollup.config.js` and `postcss.config.js`\n\n## .svelte template\n\ntemplates can contain attributes which reference an asset, eg `\u003cimg src=\"path/foo.png\"/\u003e`\nand we want it to be `\u003cimg src=\"output/foo~hash.png\"/\u003e` in the build output\n\n\u003e ##### Solution\n\u003e\n\u003e use a svelte markup preprocessor to process asset urls with postcss-smart-asset.\n\u003e\n\u003e see `tools/svelte-preprocessors/smart-asset.js`\n\nTODO: this is a proof of concept and only handles src, href and xlink:href for now. more generic, possibly via options\n\n## stable hashes\n\nAssets can be referenced from different sources and are processed by different tools.\nBut if the same asset is referenced we need all of them to resolve the same\n\n\u003e ##### Solution\n\u003e\n\u003e - use smart-asset with similar configurations everywhere for resolving/copying\n\u003e - rollup-plugin-smart-asset doesn't offer multi option, so use multiple instances with one config each\n\nImporting main.css in main.js produces same hash, eg `main~23ab778.js, main~23ab778.css` that changes when css or js changes\n\n\u003e ##### Solution\n\u003e\n\u003e use it as input in rollup config. (must come before main.js input in list!)\n\u003e\n\u003e that way css gets its own 'main.js' output which is actually empty and we ignore it in create-html plugin\n\n## build-time constants required in different files\n\nDue to the complex build, some constants are required in different files\n\n\u003e ##### Solution\n\u003e\n\u003e add a separate `build-constants.js` file and import where needed\n\nTODO: add rollup plugin to be able to import these constants in js (see proxx consts: )\n\n## keeping it fast\n\nhashing costs time.\n\n\u003e ###### Solution\n\u003e\n\u003e - only do it in production builds\n\u003e - use metrohash128\n\u003e   TODO: can rollup be told to use metrohash128 and support `[contenthash]` instead of `[hash]`?\n\nminifying costs time\n\n\u003e ###### Solution\n\u003e\n\u003e - only do it in production\n\u003e   ** only import terser plugin if production\n\u003e   ** only use cssnano in production\n\u003e   TODO: minify html\n\n## favicon\n\nfavicon should be hashed aswell\n\n\u003e ##### Solution\n\u003e\n\u003e add it as input in rollup config and inject it in create-html\n\n## other todos\n\n- support output formats besides 'es'\n- more features for index.ejs\n- dev server and livereload\n- hmr\n- routify\n- markdown support (mdsvex or simpler)\n- prettier, linter, husky, testing, ci, you name it\n\n## goodies\n\n- Due do emitCss:true and rollup-plugin-postcss, css in svelte can be whatever is handled by your postcss config.\n  see `postcss.config.js` and `tailwind.config.js`\n- You can also import from node_modules, see usage of @mdi/svg in App.svelte for an example\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frixo%2Frrs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frixo%2Frrs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frixo%2Frrs/lists"}