As of 2021,the digital economy has accounted for 39.8% of GDP,making it represent not only an important engine to drive economic development,but also an important way to promote high-quality development in China.The Artificial Internet of Things(AIOT),as an emerging technology derived from the digital transformation of IOT,is conducive to improving the competitiveness and added value of IOT products and bringing higher social and economic benefits.The intelligent attributes of AIOT can be reflected by the big data cockpit.Through the large visualization screen with personalized,hierarchical and spatial sense,AIOT can realize digital and intelligent management of IOT terminals and their data through a convenient and efficient SaaS platform.Digital cockpit is a Web platform composed of digital visualization large screen and SaaS service.Currently,many Web platforms adopt the MVC model architecture,in which the Web view is generated by the server and returned to the browser for rendering.However,the current substantial increase in computing power of smart terminals makes them fully capable of handling complex algorithms or business logic,and the MVVM pattern uses edge computing to sink the computation,construction,and generation of views to the browser for completion,which undoubtedly saves the performance of the server.Therefore,this paper is dedicated to the design and development of the Web using the MVVM pattern.This paper mainly designs and implements a multi-layer composite Web model architecture for complex and diverse data forms,which can separate the view components from the business components of the Web and has a significant effect on reducing the dependence of the view on the data model and business logic;at the same time,it builds a rich set of charting components library.In order to solve the problem of poor flexibility and low performance of many current Web development models,this paper designs and implements a cockpit development framework in MVVM mode based on virtual nodes and Diff algorithm technology;at the same time,the code conflict problem of single-page applications in MVVM mode and the code redundancy problem of front-end engineering are effectively solved.Based on OWASP TOP 10 2021,the Web firewall with multiple defense strategies designed and built is of great significance in effectively solving common vulnerabilities such as SQL injection and XSS attacks in the platform.In this paper,the MVVM technology-based IOT data cockpit designed and implemented has been applied in the Sunshine Long Run platform,the Intelligent Power Saving Room Sub-platform,and the Smart Power Consumption platform,meeting the needs raised by different customers.This process can see that its customization capability,expandability,performance,stability,and page response speed are all guaranteed. |