{"id":30756903,"url":"https://github.com/gravity-ui/uikit-perf-stats","last_synced_at":"2025-10-30T05:19:15.282Z","repository":{"id":284243043,"uuid":"954303569","full_name":"gravity-ui/uikit-perf-stats","owner":"gravity-ui","description":null,"archived":false,"fork":false,"pushed_at":"2025-08-02T13:32:40.000Z","size":431,"stargazers_count":4,"open_issues_count":3,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-04T11:00:11.532Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","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/gravity-ui.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,"zenodo":null}},"created_at":"2025-03-24T21:55:51.000Z","updated_at":"2025-08-24T12:16:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"1724ecc1-0f35-4aa5-a005-b3aee1c9c575","html_url":"https://github.com/gravity-ui/uikit-perf-stats","commit_stats":null,"previous_names":["korvin89/gravity-ui-perf","gravity-ui/uikit-perf-stats"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/gravity-ui/uikit-perf-stats","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit-perf-stats","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit-perf-stats/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit-perf-stats/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit-perf-stats/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gravity-ui","download_url":"https://codeload.github.com/gravity-ui/uikit-perf-stats/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gravity-ui%2Fuikit-perf-stats/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":281748750,"owners_count":26554835,"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","status":"online","status_checked_at":"2025-10-30T02:00:06.501Z","response_time":61,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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-09-04T10:50:12.113Z","updated_at":"2025-10-30T05:19:15.268Z","avatar_url":"https://github.com/gravity-ui.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Performance Comparer\n\n## Description\n\nPerformance Comparer is a tool for measuring and comparing the performance of React components using [Playwright](https://playwright.dev) and [PerformanceObserver](https://developer.mozilla.org/en-US/docs/Web/API/PerformanceObserver).\n\n## TLDR\n\n[Performance Reports](#performance-reports)\n\n## Measurement Approach\n\nMain stages:\n\n1. **Metrics Collection**\n\n   - Uses `PerformanceObserver` to track `measure` events (custom measurements)\n   - All metrics are stored in the global `__PERFORMANCE_METRICS__` object\n\n2. **Measured Indicators**\n\n   - Rendering time (ms)\n     - Average value\n     - Minimum value\n     - Maximum value\n   - Number of DOM nodes in the component\n\n3. **Measurement Process**\n   - Test runs the specified number of times\n   - For each run:\n     - PerformanceObserver is initialized\n     - Component rendering is executed\n     - All metrics are collected\n     - Total rendering time is calculated\n   - Results are aggregated and saved in the report\n\n## How to Use\n\n### Requirements\n\n- Node.js \u003e= 20\n- Playwright\n- Docker (for running in container)\n\n### Configuration\n\nAll environment variables must be defined in the `.env` file:\n\n```bash\nREPEAT_EACH=1                       # Number of repetitions for each test\nVITE_AVATAR_NODES_COUNT=1000        # Number of nodes for Avatar component\nVITE_BUTTON_NODES_COUNT=1000        # Number of nodes for Button component\nVITE_CHECKBOX_NODES_COUNT=1000      # Number of nodes for Checkbox component\nVITE_LABEL_NODES_COUNT=1000         # Number of nodes for Label component\nVITE_LINK_NODES_COUNT=1000          # Number of nodes for Link component\nVITE_NUMBER_INPUT_NODES_COUNT=1000  # Number of nodes for NumberInput component\nVITE_RADIO_GROUP_NODES_COUNT=1000   # Number of nodes for RadioGroup component\nVITE_SWITCH_NODES_COUNT=1000        # Number of nodes for Switch component\nVITE_TEXT_NODES_COUNT=1000          # Number of nodes for Text component\nVITE_TEXT_INPUT_NODES_COUNT=1000    # Number of nodes for TextInput component\nVITE_TEXT_AREA_NODES_COUNT=1000     # Number of nodes for TextArea component\n```\n\n### 1. Environment Setup\n\n```bash\n# Install dependencies\nnpm run playwright:install\n\n# Clear cache (if needed, for example when .env file changes)\nnpm run playwright:clear-cache\n```\n\n### 2. Running Tests\n\n```bash\n# Run tests locally\nnpm run playwright\n\n# Run tests in Docker\nnpm run playwright:docker\n```\n\n### 3. Results\n\nTest results will be displayed in the console after successful test completion.\n\n## Performance Reports\n\nThe reports present performance testing results for the following UI libraries: [antd](https://github.com/ant-design/ant-design), [@gravity-ui/uikit](https://github.com/gravity-ui/uikit), [@mui/material](https://github.com/mui/material-ui), [@adobe/react-spectrum](https://github.com/adobe/react-spectrum):\n\n- [Report with 10 nodes](./REPORT_10.md)\n- [Report with 100 nodes](./REPORT_100.md)\n- [Report with 1000 nodes](./REPORT_1000.md)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravity-ui%2Fuikit-perf-stats","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgravity-ui%2Fuikit-perf-stats","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgravity-ui%2Fuikit-perf-stats/lists"}