[发明专利]一种前端页面多端开发系统及其方法

说明书

本发明涉及一种前端页面多端开发系统及其方法，该系统包括多个不同类型的前端，多个前端分别与后端相互连接，前端用于发送页面配置信息表给后端，以及从后端接收相应的页面配置信息并进行解析、页面渲染；后端根据前端发送的页面配置信息表，返回对应的页面配置信息给前端。该方法包括：前端发送页面配置信息表给后端；后端根据接收的页面配置信息表，转化得到对应的页面配置信息；后端将转化得到的页面配置信息发送给对应的前端；前端接收页面配置信息后，依次进行解析及渲染页面，完成前端页面开发。与现有技术相比，本发明能够有效提高前端页面开发的产品迭代性能、减少开发成本、提高产品性能及交互体验。

技术领域

本发明涉及前端页面开发技术领域，尤其是涉及一种前端页面多端开发系统及其方法。

背景技术

随着互联网技术的发展，前端页面开发技术也不断更新迭代，用户的交互体验要求也越来越高。所以很多公司产品不仅仅涉及原先的web网页端的展示形态，还需要更多的产品展示形态，包括原生app(安卓、IOS)、H5、小程序(微信、京东、淘宝、支付宝、QQ、字节、抖音等等)，那么技术开发资源需要投入更多的人力，整个产品开发及维护将存在很高的成本。

为了解决这一困扰，现在市面也推出了很多的技术解决方案，这些解决方案的技术核心是相似的，都是把前端一套代码(JS开发语言)，通过打包工具将代码转化成各个平台能运行的产物，或者加入运行时编译代码，在代码运行的过程中进行转化。

比如市面上用的比较多的多端异构框架Taro、Uniapp。Taro是一个开放式跨端跨框架解决方案，支持使用React/Vue/Nerv等框架来开发微信/京东/百度/支付宝/字节跳动/QQ/飞书小程序/H5/RN等应用；uni-app则是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝)、快应用等多个平台。

然而这些框架仅仅解决了产品如何快速开发及迭代落地在各个平台上的问题，由于不是平台的原生代码开发，所以存在很多的缺陷：

1、因为通过打包产物会产生很多的冗余代码，这些代码会增加代码包体积。

2、由于不是平台的原生代码，所以开发阶段需要重新构建，然而打包技术在性能上的处理较差，会造成开发人员耗费额外的开发时间，以不断构建代码。

3、由于不是原生平台的代码，所以交互体验及代码执行的性能较差，甚至有些产品的需求在技术方案上无法实现。

由此可知，上述框架本身存在一定的bug，包括已知的以及未知的，这些bug的存在，将直接影响用户开发迭代的速度、降低产品的迭代能力。

发明内容

本发明的目的就是为了克服上述现有技术存在的缺陷而提供一种前端页面多端开发系统及其方法，以提高前端页面开发的产品迭代性能、减少开发成本、提高产品性能及交互体验。

本发明的目的可以通过以下技术方案来实现：一种前端页面多端开发系统，包括多个不同类型的前端，所述多个前端分别与后端相互连接，所述前端用于发送页面配置信息表给后端，以及从后端接收相应的页面配置信息并进行解析、页面渲染；

所述后端根据前端发送的页面配置信息表，返回对应的页面配置信息给前端。

进一步地，所述多个前端分别设置有对应的渲染引擎模块，所述渲染引擎模块用于解析页面配置信息并渲染页面。

进一步地，所述后端设置有转化模块，所述转化模块用于根据前端的页面配置信息表，转化得到对应的页面配置信息。

进一步地，所述多个前端包括但不限于安卓app端、IOS app端、web端和小程序端。

一种前端页面多端开发方法，包括以下步骤：