[发明专利]页面的展示、源码文件的编译方法、装置、设备及介质

说明书

本发明实施例公开了一种前端页面的浏览器展示、源码文件的编译方法、装置、计算机设备及存储介质。其中，该前端页面的浏览器展示方法包括：获取与待展示的目标页面匹配的页面文件，所述页面文件中包括：编译插件以及页面源码文件；调用所述编译插件对所述页面源码文件进行编译处理，形成与所述页面源码文件匹配的页面编译结果；加载所述页面编译结果，以在所述浏览器中展现所述目标页面。本发明实施例，通过上述方法，解决了现有技术在生成页面编译文件后，需要经过繁琐的后续操作，才能生成可展示的页面编译结果的问题，降低了开发者的工作复杂度。

技术领域

本发明实施例涉及计算机数据处理技术，尤其涉及一种前端页面的浏览器展示、源码文件的编译方法、装置、计算机设备及存储介质。

背景技术

前端页面的开发是创建Web(World Wide Web，全球广域网)页面或APP(application，手机软件)等前端界面呈现给用户的过程，通过HTML(Hyper Text MarkupLanguage，超文本标记语言)、CSS(Cascading Style Sheets，层叠样式表)及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。前端页面的开发从网页制作演变而来，名称上有很明显的时代特征。在互联网的演化进程中，网页制作是Web1.0时代的产物，早期网站主要内容都是静态，以图片和文字为主，用户使用网站的行为也以浏览为主。随着互联网技术的发展和HTML5、CSS3的应用，现代网页更加美观，交互效果显著，功能更加强大。

目前，现有的前端开发中，使用模块化和数据绑定技术的React和Vue的MVVM(Model-View-ViewModel)框架可以让用户方便上手开发大型应用。但是，开发需要安装node npm等脚手架工具，且需要一系列的配置，打包以及编译后才能生成最终的、可在浏览器中进行展示的前端页面，对开发者来说，操作繁琐、且实现难度较高，对开发者要求较高。此外，由于上述框架使用的库函数代码量很大，即使使用上述框架对小型页面(典型的，H5页面)进行开发，最终打包形成的页面体积也会很大，对该页面的分发、下载以及传播都会带来很大的冗余浪费。

发明内容

本发明实施例提供了一种前端页面的浏览器展示、源码文件的编译方法、装置、计算机设备及存储介质，最大程度的简化开发者的开发得到前端页面的操作，并大大减少前端页面的代码体积，达到了精简页面代码的目的。

第一方面，本发明实施例提供了一种前端页面的浏览器展示方法，由浏览器执行，包括：

获取与待展示的目标页面匹配的页面文件，所述页面文件中包括：编译插件以及页面源码文件；

调用所述编译插件对所述页面源码文件进行编译处理，形成与所述页面源码文件匹配的页面编译结果；

加载所述页面编译结果，以在所述浏览器中展现所述目标页面。

进一步地，通过所述编译插件对所述页面源码文件进行编译处理，形成与所述页面源码文件匹配的页面编译结果，包括：

通过所述编译插件每当检测到所述页面源码文件中发生数据变化时，根据所述数据变化，更新所述页面源码文件中包括的DOM节点，以形成所述页面编译结果。

进一步地，通过所述编译插件检测到所述页面源码文件中发生数据变化，包括：

通过所述编译插件采用观察者模式，检测所述页面源码文件中发生数据变化。

进一步地，所述页面源码文件为符合React编程框架语法规则的源码文件；

在所述编译插件中，使用精简后的React框架，生成页面编译结果。

第二方面，本发明实施例还提供了一种源码文件的编译方法，由页面文件中的编译插件执行，包括：