概要：
本文针对前端框架中存在的代码复用性低、页面响应速度慢以及开发轻量级web APP缺乏性能的问题，提出了JavaScript、Ajax等传统的前端开发技术以及Html5、 实现了基于数据驱动模型的Web前端框架。 具体研究内容如下。 首先深入研究和分析了MVC、MVP和MVVM三种数据驱动模型在前端框架中的应用，优缺点以及当前主流的Web前端框架的结构和实现原理； 采用基于数据驱动模型的体系结构设计思想，对前端框架进行了需求分析、体系结构设计、类图设计以及视图层、模型层和视图模型层的详细设计。 在此基础上，实现了基于数据驱动模型的高效Web前端开发框架。 框架包括视图、模块、模型、模板、事件、表达式、命令、过滤器、请求、插件、路由、编译和渲染功能。 该框架实现了数据驱动呈现模式，页面修改只需修改数据即可实现，大大降低了开发成本，提高了开发效率，完成了三个方面的优化： 另一方面，通过为框架提供完整的模块化支持，页面以模块为单位进行组合，基于模块构建spa APP，提高了模块的复用度，提高了前端开发代码的复用性。 另一方面，研究和优化框架内的数据存储和提取方法，提出数据模块化存储方案，在保证数据完整性的同时，缩短与服务器的数据交互时间，有效提高页面响应速度，实现用户体验同时，通过采用差异渲染的框架性能优化方案，减少dom树的节点遍历，减少时间复杂度，在框架复杂度和性能优化之间取得平衡。 最后完成了基于数据驱动模型的Web前端框架的整体应用和全面测试。 通过前端框架在WebApp中的应用、代码质量检测和自动化功能测试描述整个框架的流程和易用性。 同时，对实现的前端框架和当前主流的前端框架AngularJS和ReactJS进行了性能对比测试，结果表明框架在渲染绘制效率、页面响应效率、内存占用效率以及资源加载效率方面都有所提高论文实现的基于数据驱动模型的Web前端框架在逻辑上证明具有适合开发简单web APP应用的性能。
展开