Ai-Assisted Legacy Front-End Modernization: Intelligent Jquery-To-React Transformation Using Automated Component Extraction And Dependency Analysis

Abstract

Legacy enterprise web applications built with jQuery-based application architecture form a large proportion of the most ubiquitous live production systems in the financial services‚ health care and regulated enterprise markets․ Due to the intrinsic imperative DOM manipulation‚ state management and event handling conventions and tight coupling of these applications‚ conventional enterprise-scale manual refactoring is not an option for these systems․ We present an AI-assisted transformation pipeline for legacy front-end modernization‚ which conducts automated component extraction and dependency analysis to transform legacy jQuery web applications into React component systems․ We‚ in particular‚ use static analysis and code pattern classification through machine learning to predict component boundaries in React code‚ create dependency graphs that illustrate inter-module dependencies‚ and synthesize candidate React components for inspection and modification by developers․ The hybrid-coexistence layer supports incremental migration․ The experiment shows that prioritizing extraction candidates based on the workflow and applying AI-assisted regression test suite generation can reduce the migration time and defects․ The article concludes with an overview of the organization and governance of large-scale front-end modernization efforts․