{"id":26221777,"url":"https://github.com/push-based/ws-angular-performance","last_synced_at":"2026-03-07T11:03:59.122Z","repository":{"id":40484168,"uuid":"488370663","full_name":"push-based/ws-angular-performance","owner":"push-based","description":"An Angular project prepared to learn about performance optimizations","archived":false,"fork":false,"pushed_at":"2022-05-05T11:27:42.000Z","size":1072,"stargazers_count":4,"open_issues_count":1,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-01T03:35:51.060Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/push-based.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.MD","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-05-03T21:40:31.000Z","updated_at":"2022-06-21T09:09:14.000Z","dependencies_parsed_at":"2022-08-09T21:50:53.474Z","dependency_job_id":null,"html_url":"https://github.com/push-based/ws-angular-performance","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/push-based/ws-angular-performance","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/push-based%2Fws-angular-performance","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/push-based%2Fws-angular-performance/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/push-based%2Fws-angular-performance/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/push-based%2Fws-angular-performance/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/push-based","download_url":"https://codeload.github.com/push-based/ws-angular-performance/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/push-based%2Fws-angular-performance/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30212103,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-07T09:02:10.694Z","status":"ssl_error","status_checked_at":"2026-03-07T09:02:08.429Z","response_time":53,"last_error":"SSL_read: 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":"2025-03-12T16:29:35.040Z","updated_at":"2026-03-07T11:03:54.114Z","avatar_url":"https://github.com/push-based.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# angular-movies\n\nThis is a Movies App built using [Angular](https://angular.io) and [RxAngular](https://github.com/rx-angular/rx-angular).  \nAs data source the [The Movie Database (TMDB)](https://www.themoviedb.org/) API is used. \n\n[![angular-and-rx-angular](https://user-images.githubusercontent.com/10064416/154189195-c32cbdec-b061-46a5-8590-a9e3d8dc050a.png)](https://www.rx-angular.io/)\n\n\n\n\u003csection\u003e\n  \u003cbr/\u003e\n  \u003cb\u003epowered by \n    \u003cimg height=\"40\" width=\"auto\" title=\"push-based.io\" src=\"https://user-images.githubusercontent.com/10064416/158282835-d577b7dc-17f0-4269-9ebc-8f17bfc2ec9c.png\" /\u003e\n  \u003c/b\u003e\n\u003c/section\u003e\n\n\n## Demo\n\nA [live deployment](https://angular-movies-a12d3.web.app/list/category/popular) of this app is available to try it out.\n\n\n## Performance Optimizations \n\n\n[![angular-movies--after-before](https://user-images.githubusercontent.com/10064416/155904454-f70b5bb5-6591-497a-9d21-dca0e2940566.gif)](https://www.webpagetest.org/video/compare.php?tests=220216_BiDcPP_CVM,220216_AiDcBN_ETK)\n\n\nFor now you can search the codebase for \"Perf Tip\" later on there will be propper documentation here.\n\n\n[Measures before optimization](https://lighthouse-metrics.com/checks/9ddeb46e-2c28-453c-b719-cf080a01b13c)\n[![angular-movies-before_michael-hladky](https://user-images.githubusercontent.com/10064416/137785051-1cf9f63a-e803-4d92-a952-c327b7628530.PNG)](https://lighthouse-metrics.com/checks/9ddeb46e-2c28-453c-b719-cf080a01b13c)\n\n\n[Measures after optimization](https://lighthouse-metrics.com/checks/6a888a17-b17b-46a6-abc9-e605b73a530c/runs/503701ad-36aa-43ad-8de3-cb40e775c770)\n![angular-movies-after-optimization_michael-hladky](https://user-images.githubusercontent.com/10064416/146446241-ad9eeed4-b0a4-44a2-a88e-4ea7c97e1acf.PNG)\n\n\n**Bundle Stats**\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\u003c!-- bundle-stats-start --\u003e\n| Names             |       Size |\n| ---               | ---        |\n| main.3be9aa83a5fc0ab3.js           | 333.7 KB |\n| styles.be05b375b7ddee56.css           | 6.14 KB |\n| runtime.2ebee702aaf70ea8.js           | 3.73 KB |\n  | **Initial Total** | **343.57 KB** |\n  | Names             |       Size |\n| app_pages_movie-detail-page_movie-detail-page           | 15.43 KB |\n| app_pages_person-detail-page_person-detail-page           | 10.94 KB |\n| common.fa88d42376be556b.js           | 10.69 KB |\n| app_pages_account-feature_list-detail-page_list-items-edit_list-items-edi-393246.a07ece70117839f4.js           | 6.93 KB |\n| app_app-shell_account-menu_account-menu_component_lazy_ts.dbb1672cdc5020df.js           | 4.32 KB |\n| app_pages_account-feature_account-list-page_account-list-page           | 4.01 KB |\n| app_pages_account-feature_list-detail-page_list-detail-page           | 3.93 KB |\n| app_pages_account-feature_list-detail-page_list-remove_list-remove           | 3.23 KB |\n| app_pages_account-feature_list-detail-page_list-image_list-image           | 2.77 KB |\n| app_pages_not-found-page_not-found-page           | 1.84 KB |\n| app_pages_account-feature_list-detail-page_list-movies_list-movies           | 837 Bytes |\n\u003c!-- bundle-stats-end --\u003e\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n## Comparison to next and nuxt\n\n- [angular](https://angular-movies-a12d3.web.app/list/category/popular)\n- [next](https://movies.zaps.dev/?category=Popular\u0026page=1)\n- [nuxt](https://movies.jason.codes/movie/category/popular)\n\n[![angular-vs-next-vs-nuxt](https://user-images.githubusercontent.com/10064416/155904543-333e1c25-7c01-470a-b399-40eee4c9d02c.gif)](https://www.webpagetest.org/video/compare.php?tests=220216_AiDcBJ_EAA,220216_BiDcER_CDY,220216_BiDc68_CDZ)\n\n## Contributing\n\nContributions are always welcome! \n\nFor large changes, please file an issue to discuss your proposed changes with us before working on a PR :)\n\n## Installation  \n\nClone and install the dependencies for `ws-angular-performance` locally:\n\n```bash \n  git clone https://github.com/push-based/ws-angular-performance.git\n  cd angular-movies \n  npm install\n```\n\n## Quick setup\n\n1. Take a copy of `src/environments/environment.local.example.ts` and re-name to `src/environments/environment.prod.ts` \n2. Get your TMDb API key\n3. Get your TMDB API read access token\n4. Enter the details into the `src/environments/environment.prod.ts` file\n    \n## Running locally\n\n* `npm run build:dev`: dev build\n* `npm run build:prod`: production build\n* `npm run build:prod:ssr`: production build for SSR\n* `npm run start`: serve the project locally for development\n* `npm run start:ssr:dev`: serve the project locally SSR for development\n* `npm run start:ssr:prod`: serve the project locally SSR for production\n* `npm run analyze:bundlesize`: bundle size analysis \n\n## Tech Stack\n\nBuilt with: \n\n* [Angular](https://angular.io)\n* [rx-angular](https://github.com/rx-angular/rx-angular)\n\n[![angular-and-rx-angular](https://user-images.githubusercontent.com/10064416/154189195-c32cbdec-b061-46a5-8590-a9e3d8dc050a.png)](https://www.rx-angular.io/)\n\nMeasures:\n* Bundle sice listed fron dist\n* Comparison videos with [webpagetest](https://www.webpagetest.org)\n* Lighthoure reports with [lighthouse-metrics](https://lighthouse-metrics.com)\n* User-flows created with [@push-based/user-flow](https://www.npmjs.com/package/@push-based/user-flow)\n\n## Authors\n\n- [push-based.io](https://push-based.io)\n- [Michael Hladky](https://github.com/BioPhoton)\n- [Kirill Karnaukhov](https://github.com/Karnaukhov-kh)\n- [Julian Jandl](https://github.com/HoebbelsB)\n- [Vojtech Mašek](https://github.com/vmasek)\n\n\nBased on the original `angular-movies` foundation by [@clamarque](https://github.com/clamarque/angular-movies).\n  \n## License\n\n[MIT](https://choosealicense.com/licenses/mit/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpush-based%2Fws-angular-performance","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpush-based%2Fws-angular-performance","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpush-based%2Fws-angular-performance/lists"}