Part 1- Refactor ddm-form-report-web to avoid timeout loading the JS

• Type: Task
• Status: Closed
• Priority: Minor
• Resolution: Fixed
• Affects Version/s: None
• Fix Version/s: None
• Component/s: Forms
• Labels:
  • bravo-backlog
  • team-bravo
• Epic Link: Technical Debts

Issue

Timeout exception loading the JS code is leading CI to fail very often while executing the Forms poshi tests
    

Approaches

A. Code Splitting

• Use React lazy to do a code splitting and load the components  on demand (100%)
  • Start point: `modules/apps/dynamic-data-mapping/dynamic-data-mapping-form-web/src/main/resources/META-INF/resources/admin/js/App.es.js` (it can cut down the initial loading size from 11 to 3MB) - (25% - LPS-147265)
    • Lazy load RuleBuilder
    • Lazy load Report
  • Lazy load recharts (50% - LPS-147459)

• Split the CSS to be imported into components to avoid load all at once

 

B. Cut down the bundle size (optional)

• Remove unused JS
• Remove unused CSS
• Deduplicate components and utils
• Check the size and the possibility to remove 3rd party dependencies