Design And Implementation Of Web Front-end Performance Monitoring System

With the rapid expansion of the information network,Web applications are becoming more and more widespread,and people are increasingly inseparable from it in their lives and work.At the same time,the requirements for it are gradually increasing,and people are no longer limited to the functions of Web applications,but are seeking a better user experience.The performance of the Web application front-end directly determines the quality of service and user experience provided by the application,which largely affects whether the user will continue to use the application.Therefore,front-end performance has become an important concern in front-end development.To improve front-end performance,monitoring front-end performance data is the first and most important step to solve the problem.In summary,this thesis builds a simple,efficient and scalable Web application front-end performance monitoring platform.According to the development method of software engineering,this thesis firstly investigates the status of tools and platforms related to Web front-end performance testing at home and abroad,analyzes and summarizes the shortcomings of existing solutions,and combines use case diagrams to sort out the functional requirements of Web front-end performance monitoring platform.And performance requirements,according to the function point,the platform is divided into six modules: user management module,application management module,application monitoring module,data analysis module,data visualization module,abnormal alarm module;then according to the platform's own characteristics,choose React+Node +Express+Mongo DB technology stack realizes platform technology architecture-B/S architecture,and combines technical architecture diagram,function module diagram,function flow diagram,etc.to design and implement the functions of each module of the platform,and finally combine specific test cases and tests.As a result,the platform was fully tested in terms of functionality and performance,verifying the integrity and reliability of the platform.The monitoring platform is built and developed based on the open source framework.It has the advantages of cross-platform,easy expansion and easy maintenance.The Web front-end performance monitoring platform is a monitoring platform for multi-user and multi-applications.It uses the emerging technology Performance interface to obtain real Performance data,and the use of visualization technology to provide users with a visual display,to provide a powerful tool support for front-end developers in performance optimization and improvement.