Prasad P. Pawar created ATLAS-5346:
--------------------------------------
Summary: Atlas React UI: Reduce React UI build time and bundle
size through Vite optimization and lazy route loading
Key: ATLAS-5346
URL: https://issues.apache.org/jira/browse/ATLAS-5346
Project: Atlas
Issue Type: Improvement
Components: atlas-ci-build
Affects Versions: 3.0.0
Reporter: Prasad P. Pawar
Assignee: Prasad P. Pawar
Optimize the Atlas React UI ({{{}dashboard/{}}}) production build by reducing
build time, improving bundle splitting, and streamlining the Maven/npm build
pipeline. Changes include Vite configuration updates, lazy loading of heavy
views, removal of unused demo components from the main bundle, ESLint
flat-config migration, and Maven frontend plugin improvements.
h3. Problem Statement
The React UI production build was slow and produced large monolithic bundles
because heavy modules (Statistics, Entity Detail tabs, Administrator views,
D3/MUI stacks) were eagerly loaded. The Maven build also copied unnecessary
artifacts and re-downloaded toolchain dependencies on each run, adding overhead
in local and CI builds.
h3. Proposed Solution / Changes Implemented
h4. 1. Vite build optimization ({{{}vite.config.ts{}}})
* Added manual chunk splitting for {{{}react{}}}, {{{}mui{}}}, {{{}redux{}}},
{{{}router{}}}, {{{}d3{}}}, and {{utils}}
* Disabled compressed size reporting ({{{}reportCompressedSize: false{}}}) for
faster builds
* Increased chunk size warning limit
h4. 2. Lazy loading & bundle size reduction
* Layout.tsx — lazy-load {{Statistics}} module
* EntityDetailPage.tsx — lazy-load detail tabs (Properties, Schema, Lineage,
Relationships, etc.)
* AdministratorLayout.tsx — lazy-load administrator sub-views
* Removed unused/heavy components from main bundle:
** Masonry demo components ({{{}MasonryCard{}}}, {{{}MasonryGrid{}}},
{{{}MasonryDemo{}}})
** Standalone {{LineageLayout}} React view (lineage handled via existing tab
flow)
h4. 3. Statistics module refactor
* Extracted chart rendering into {{EntityStatsChart.tsx}}
* Moved shared utilities into {{statsUtils.tsx}}
* Updated related tests
h4. 4. Build tooling & dependencies ({{{}package.json{}}},
{{{}package-lock.json{}}})
* Upgraded Vite {{{}6.4.3{}}}, {{@vitejs/plugin-react-swc}} {{{}4.3.1{}}},
ESLint {{10.5.0}}
* Migrated from {{.eslintrc.cjs}} to flat config ({{{}eslint.config.js{}}})
* Added build scripts: {{{}build:lineage{}}}, {{{}build:legacy{}}},
{{build:check}}
* Separated typecheck from build using {{tsconfig.build.json}} (excludes test
files)
* Added platform-specific optional dependencies for Rollup, esbuild, and SWC
* Updated npm overrides for transitive security pins ({{{}d3-color{}}},
{{{}lodash{}}}, {{{}minimatch{}}}, etc.)
* Added {{.npmrc}} for faster installs ({{{}prefer-offline{}}},
{{{}audit=false{}}}, etc.)
h4. 5. Maven / CI build pipeline ({{{}dashboard/pom.xml{}}}, root
{{{}pom.xml{}}})
* Build directly from {{dashboard/}} module root (dashboardv2-style)
* Persist frontend toolchain under {{.frontend-toolchain/}} to avoid
re-downloading Node on every build
* Configurable npm cache directory for CI
* Simplified WAR resource packaging to use {{dashboard/dist}} directly
* Added {{ensure-lineage-build.mjs}} for separate lineage asset build step
* Improved {{ensure-native-deps.mjs}} with fast-path for already-installed
native binaries
h4. 6. TypeScript config
* Updated {{tsconfig.json}} and {{tsconfig.build.json}} for production-only
type checking
--
This message was sent by Atlassian Jira
(v8.20.10#820010)
