CN115167799A

CN115167799A - 可视化大屏的快速展示方法、装置、设备及存储介质

Info

Publication number: CN115167799A
Application number: CN202211081709.XA
Authority: CN
Inventors: 曾澄; 田志国; 沈世通; 廖宏军; 陈军; 冯建设
Original assignee: CITIC Holdings Co Ltd; Shenzhen Xinrun Fulian Digital Technology Co Ltd
Current assignee: CITIC Holdings Co Ltd; Shenzhen Xinrun Fulian Digital Technology Co Ltd
Priority date: 2022-09-06
Filing date: 2022-09-06
Publication date: 2022-10-11
Anticipated expiration: 2042-09-06
Also published as: CN115167799B

Abstract

本申请公开了一种可视化大屏的快速展示方法、装置、设备及存储介质，所述可视化大屏的快速展示方法包括：获取预加载的资源信息；基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。本申请属于互联网技术领域，通过引入的带有预开发资源压缩工具的资源处理插件，对所述预加载的资源信息进行压缩处理，减少了工业互联网可视化大屏首屏打开时图像的渲染时间和文件的加载时间，从而使得用户打开工业互联网可视化大屏时，不会出现卡顿、等待动画渲染过久且出现错误异常的情况，提高了用户体验。

Description

可视化大屏的快速展示方法、装置、设备及存储介质

技术领域

本申请涉及互联网技术领域，尤其涉及一种可视化大屏的快速展示方法、装置、设备及存储介质。

背景技术

现有的工业互联网可视化大屏因为首屏打开会渲染很多动画，加载很多图片；用户打开页面时，会因为网速或者客户端的性能问题而导致打开页面非常慢，十分卡顿，会让用户体验感非常差，甚至可能导致错误问题，需要重新加载。

发明内容

本申请的主要目的在于提供一种可视化大屏的快速展示方法、装置、设备及存储介质，旨在解决现有技术中可视化大屏首屏打开会导致页面无法加载，用户体验感差的技术问题。

为实现以上目的，本申请提供一种可视化大屏的快速展示方法，所述可视化大屏的快速展示方法包括：

获取预加载的资源信息；

基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。

可选地，所述资源信息包括图像资源和文件资源，所述基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息的步骤，包括：

基于所述资源处理插件，对所述图像资源进行图像压缩，得到压缩后的图像资源；

对所述文件资源进行文件压缩打包处理，得到压缩打包后的文件资源；

基于所述压缩后的图像资源和所述压缩打包后的文件资源，得到所述压缩后的资源信息。

可选地，所述对所述图像资源进行图像压缩，得到压缩后的图像资源的步骤，包括：

扫描所述图像资源，确定所述图像资源中像素值差值在预设范围内的像素块；

将所述像素块进行合并，得到所述压缩后的图像资源。

可选地，所述文件资源包括交互操作的代码资源，对所述文件资源进行文件压缩打包处理，得到压缩打包后的文件资源的步骤，包括：

对所述代码资源进行代码筛查，确定合规代码；

对所述合规代码进行代码压缩处理，得到代码压缩后的代码资源；

对所述代码压缩后的代码资源进行分片打包处理，得到分片打包后的文件资源。

可选地，所述对所述代码压缩后的代码资源进行分片打包处理，得到分片打包后的文件资源的步骤，包括：

基于预设的分割粒度，对所述代码压缩后的代码资源进行代码分割，得到预设数量的代码包；

将所述预设数量的代码包合并至一个文件，得到所述分片打包后的文件资源。

可选地，所述代码资源包括第三方依赖和业务代码，所述基于预设的分割粒度，对所述代码压缩后的代码资源进行代码分割，得到预设数量的代码包的步骤，包括：

确定所述代码资源中的第三方依赖，并将所述第三方依赖与所述业务代码分离，单独存储于一个文件空间；

基于所述分割粒度，对所述第三方依赖进行代码分割，得到预设数量的第三方代码包。

将所述预设数量的代码包合并至一个文件，得到所述分片打包后的文件资源的步骤，包括：

将所述预设数量的第三方代码包合并至一个文件，得到分片打包后的第三方依赖文件，并对所述第三方依赖文件进行缓存，以供所述资源处理文件在加载资源信息时无需重新下载所述第三方依赖文件。

可选地，所述基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息的步骤，包括：

获取用户当前的网速；

基于预设的网速划分规则，确定当前网速的网速等级；

基于所述资源处理插件，对所述资源信息进行与所述网速等级相应的压缩处理方式，得到所述压缩后的资源信息，并加载所述压缩后的资源信息。

本申请还提供一种可视化大屏的快速展示装置，所述可视化大屏的快速展示装置包括：

获取模块，用于获取预加载的资源信息；

压缩模块，用于基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。

本申请还提供一种可视化大屏的快速展示设备，所述可视化大屏的快速展示设备包括：存储器、处理器以及存储在存储器上的用于实现所述可视化大屏的快速展示方法的程序，

所述存储器用于存储实现可视化大屏的快速展示方法的程序；

所述处理器用于执行实现所述可视化大屏的快速展示方法的程序，以实现所述可视化大屏的快速展示方法的步骤。

本申请还提供一种存储介质，所述存储介质上存储有实现可视化大屏的快速展示方法的程序，所述实现可视化大屏的快速展示方法的程序被处理器执行以实现所述可视化大屏的快速展示方法的步骤。

本申请提供的一种可视化大屏的快速展示方法、装置、设备及存储介质，与现有技术中可视化大屏首屏打开会导致页面无法加载，用户体验感差相比，在本申请中，获取预加载的资源信息；基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。即在本申请中，通过引入的带有预开发资源压缩工具的资源处理插件，对所述预加载的资源信息进行压缩处理，减少了工业互联网可视化大屏首屏打开时图像的渲染时间和文件的加载时间，从而使得用户打开工业互联网可视化大屏时，不会出现卡顿、等待动画渲染过久且出现错误异常的情况。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并与说明书一起用于解释本申请的原理。为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，对于本领域普通技术人员而言，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1是本申请实施例方案涉及的硬件运行环境的设备结构示意图；

图2为本申请可视化大屏的快速展示方法第一实施例的流程示意图；

图3为本申请可视化大屏的快速展示装置的模块示意图；

图4为本申请可视化大屏的快速展示方法第二实施例的流程示意图。

本申请目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

应当理解，此处所描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。

如图1所示，图1是本申请实施例方案涉及的硬件运行环境的终端结构示意图。

本申请实施例终端可以是PC，也可以是智能手机、平板电脑、电子书阅读器、MP3（Moving Picture Experts Group Audio Layer III，动态影像专家压缩标准音频层面3）播放器、MP4（Moving Picture Experts Group Audio Layer IV，动态影像专家压缩标准音频层面4）播放器、便携计算机等具有显示功能的可移动式终端设备。

如图1所示，该终端可以包括：处理器1001，例如CPU，网络接口1004，用户接口1003，存储器1005，通信总线1002。其中，通信总线1002用于实现这些组件之间的连接通信。用户接口1003可以包括显示屏（Display）、输入单元比如键盘（Keyboard），可选用户接口1003还可以包括标准的有线接口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口（如WI-FI接口）。存储器1005可以是高速RAM存储器，也可以是稳定的存储器（non-volatile memory），例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。

可选地，终端还可以包括摄像头、RF（Radio Frequency，射频）电路，传感器、音频电路、WiFi模块等等。其中，传感器比如光传感器、运动传感器以及其他传感器。具体地，光传感器可包括环境光传感器及接近传感器，其中，环境光传感器可根据环境光线的明暗来调节显示屏的亮度，接近传感器可在移动终端移动到耳边时，关闭显示屏和/或背光。作为运动传感器的一种，重力加速度传感器可检测各个方向上（一般为三轴）加速度的大小，静止时可检测出重力的大小及方向，可用于识别移动终端姿态的应用（比如横竖屏切换、相关游戏、磁力计姿态校准）、振动识别相关功能（比如计步器、敲击）等；当然，移动终端还可配置陀螺仪、气压计、湿度计、温度计、红外线传感器等其他传感器，在此不再赘述。

本领域技术人员可以理解，图1中示出的终端结构并不构成对终端的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

如图1所示，作为一种计算机存储介质的存储器1005中可以包括操作装置、网络通信模块、用户接口模块以及可视化大屏的快速展示程序。

在图1所示的终端中，网络接口1004主要用于连接后台服务器，与后台服务器进行数据通信；用户接口1003主要用于连接客户端（用户端），与客户端进行数据通信；而处理器1001可以用于调用存储器1005中存储的可视化大屏的快速展示程序。

参照图2，本申请实施例提供一种可视化大屏的快速展示方法，所述可视化大屏的快速展示方法包括：

步骤S100，获取预加载的资源信息；

步骤S200，基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。

在本实施例中，具体的应用场景可以是：

工业互联网可视化大屏在用户打开首屏时，会渲染很多动画，加载很多图片，会因为网速或者客户端的性能问题而导致打开页面非常慢，十分卡顿，会让用户体验感非常差，甚至可能导致错误问题，需要重新加载。

具体步骤如下：

步骤S100，获取预加载的资源信息；

在本实施例中，可视化大屏的快速展示方法应用于可视化大屏的快速展示装置。

在本实施例中，可视化大屏是以数据可视化的方式在一个或多个LED大屏幕上显示业务的一些关键指标，以大屏幕为主要显示载体的数据可视化设计，工业互联网可视化大屏在用户打开首屏时，会渲染很多动画，加载很多图片，还包括交互操作的代码、文件等，因此所述预加载的资源信息包括动画资源、图片资源、交互操作的代码资源和文件资源等。

在本实施例中，装置获取预加载的资源信息的方式为当发布上线，用户打开工业互联网的界面时，装置接收资源存储模块发送的预加载至界面的资源信息。

在本实施例中，所述预设的资源处理插件是预开发的资源压缩工具组成的，为预设的quick-open-window.js文件，可以作为插件引入工业互联网大屏，开发工业互联网大屏的工程师可以在所述资源处理插件进行相关的优化开发或者功能更新等，便于提升资源压缩的能力。

在本实施例中，装置基于预设的资源处理插件，对所述资源信息进行压缩处理，包括对图像资源、文件资源和代码资源进行压缩，得到压缩后的资源信息，以供后续在加载所述压缩后的资源信息时，提高加载的效率，防止界面加载的卡顿和错误。

具体地，所述步骤S200，包括以下步骤S210-S230：

步骤S210，基于所述资源处理插件，对所述图像资源进行图像压缩，得到压缩后的图像资源；

在本实施例中，所述资源处理插件中开发有图像压缩功能，引入TinyJpg和TinyPng，作为压缩图片的工具，对所述图像资源进行图像压缩，得到压缩后的图像资源。

具体地，所述步骤S210，包括以下步骤S211-S212：

步骤S211，扫描所述图像资源，确定所述图像资源中像素值差值在预设范围内的像素块；

步骤S212，将所述像素块进行合并，得到所述压缩后的图像资源。

在本实施例中，TinyJpg/TinyPng使用智能有损压缩技术将图片体积降低，扫描所述图像资源，确定所述图像资源中像素值差值在预设范围内的像素块，并将所述像素值差值在预设范围内的像素块进行合并，得到所述压缩后的图像资源，选择性地减少图片中相似颜色，只需很少字节就能保存数据，并且对视觉影响几乎不可见，但是在文件体积上就有很大的差别。而使用到智能有损压缩技术被称为量化。TinyJpg/TinyPng在压缩png文件时效果更显著。扫描图片中相似颜色并将其合并，通过减少颜色数量将24位png文件转换成体积更小的8位png文件，丢弃所有不必要的元数据。使用优化过的图片可减少带宽流量和加载时间。

步骤S220，对所述文件资源进行文件压缩打包处理，得到压缩打包后的文件资源；

在本实施例中，所述文件资源包括HTML、CSS、JavaScript等包含交互操作的代码文件，还包括界面加载的其他文件资源，对所述文件资源进行文件压缩，减少文件资源的加载量，并将多个文件压缩合并成一个，即打包。打包是一个将文件引入并合并到一个单独文件的过程，最终形成一个“bundle”。接着在页面上引入该 bundle，整个应用即可一次性加载，以此提高资源加载的效率。

具体地，所述步骤S220，包括以下步骤S221-S223：

步骤S221，对所述代码资源进行代码筛查，确定合规代码；

在本实施例中，装置在引入的资源处理插件预开发了一个代码筛查工具，将其中的没有使用到的代码进行代码筛查，以便查找到不合规的代码，并且再发布上线之前进行删除。

具体地，所述步骤S221，包括以下步骤A100-A200：

步骤A100，基于预设的筛选条件，检测所述代码资源，得到非合规代码；

步骤A200，删除所述代码资源中的所述非合规代码，得到所述合规代码。

在本实施例中，具体所述资源处理插件使用useless-files-webpack-plugin模块，通过以下代码实现筛查：

const UselessFile = require('useless-files-webpack-plugin')chainWebpack: config => {

config.plugin('uselessFile')

.use(

new UselessFile({

root: './src', // 项目目录

out: './fileList.json', // 输出文件列表

clean: false, // 是否删除文件,

exclude: [/node_modules/] // 排除文件列表

}))}

将代码资源中未使用到的代码，即定义为非合规代码，进行筛查，并将所述非合规代码删除，保留合规代码，以此减少交互操作的代码资源的量，提高资源加载效率。

步骤S222，对所述合规代码进行代码压缩处理，得到代码压缩后的代码资源；

在本实施例中，在筛查了非合规代码后，对所述合规代码进行进一步的代码压缩处理，得到代码压缩后的代码资源，进一步减少代码资源的加载数据量，提高资源加载效率。

具体地，所述步骤S222，包括以下步骤B100-B200：

步骤B100，采用webpack插件，通过预设的参数设置，分析所述合规代码中的代码语法树，得到无效代码集合；

步骤B200，去除所述合规代码中的所述无效代码集合，得到所述代码压缩后的代码资源。

应用程序的静态模块打包工具。当webpack处理应用程序时，它会在内部构建一个依赖图(dependency 在本实施例中，所述资源处理插件采用webpack插件，通过预设的参数设置，分别对js文件、css文件和html文件进行代码压缩，其中，所述webpack 是代码编译工具，有入口、出口、loader和插件。webpack是一个用于JavaScript graph)，此依赖图对应映射到项目所需的每个模块，并生成一个或多个 bundle。

具体地，对于css文件采用以下代码实现压缩：

const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');

new OptimizeCssAssetsPlugin({ assetNameRegExp: /\.css$/g })

对于html文件采用以下代码实现压缩：

new HtmlWebpackPlugin({

template: path.join(__dirname, 'src/index.html'), // html 模板所在的位置

filename: 'index.html', // 指定打包出 html 的文件名称

chunks: ['index'], // 指定生成的 html 要生成哪些 chunk

inject: true, // 将所有资产注入给定的 template ortemplateContent

minify: {

html5: true,

collapseWhitespace: true,

preserveLineBreaks: false,

minifyCSS: true,

minifyJS: true,

removeComments: false

}

})

对于js文件webpack内置有uglifyjs-webpack-plugin，通过此插件压缩js文件，为进一步提高压缩效率，通过设定参数对js文件进行并行压缩。

步骤S223，对所述代码压缩后的代码资源进行分片打包处理，得到分片打包后的文件资源。

在本实施例中，所述资源处理插件对所述代码压缩后的代码资源合并成一个，即打包处理，所述打包处理包括gulp、webpack、Browserify等方式，其中，打包是一个将文件引入并合并到一个单独文件的过程，最终形成一个“bundle”。接着在界面上引入该bundle，整个应用即可一次性加载。

具体地，所述步骤S223，包括以下步骤C100-C200：

步骤C100，基于预设的分割粒度，对所述合规代码进行代码分割，得到预设数量的代码包；

在本实施例中，分割粒度是自行设置的，即将代码分割多少数量和每个代码文件的大小，对所述合规代码进行代码分割，得到预设数量的代码包。其中，所述代码分割的方法可以是入口起点，使用 entry 配置手动地分离代码，也可以是动态导入，通过模块的内联函数调用来分离代码。

例如，合规代码有50MB大小，将所述合规代码分成5个代码包，每个代码包具有10MB大小，在加载代码包时，可以同时加载5个代码包，以此提高加载代码资源的效率。

具体地，所述步骤C100，包括以下步骤C110-C130：

步骤C110，确定所述代码资源中的第三方依赖，并将所述第三方依赖与所述业务代码分离，单独存储于一个文件空间；

步骤C120，基于所述分割粒度，对所述第三方依赖进行代码分割，得到预设数量的第三方代码包；

步骤C130，将所述预设数量的第三方代码包合并至一个文件，得到分片打包后的第三方依赖文件，并对所述第三方依赖文件进行缓存，以供所述资源处理文件在加载资源信息时无需重新下载所述第三方依赖文件。

在本实施例中，在对代码资源进行分割打包时，首先确定代码资源中的业务代码包和第三方代码包，具体地，采用SplitChunksPlugin模块，将第三方依赖拆分成独立的js包，即第三方代码包，以便和业务代码分离开来打包。在分离出第三方代码包并打包后，由于第三方代码包在项目更新时也不会变动，采用DllReferencePlugin进行第三方代码包的引用，第三方依赖包不会变动，就不会再去重新打包，项目更新的时候，浏览器缓存的历史文件可以继续使用，提高了加载速度。

步骤C200，将所述预设数量的代码包合并至一个文件，得到所述打包后的代码资源。

在本实施例中，所述资源处理插件将所述预设数量的代码包合并至一个文件，得到所述打包后的代码资源。

步骤S230，基于所述压缩后的图像资源和所述压缩打包后的文件资源，得到所述压缩后的资源信息。

本申请提供的一种可视化大屏的快速展示方法，与现有技术中可视化大屏首屏打开会导致页面无法加载，用户体验感差相比，在本申请中，获取预加载的资源信息；基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。即在本申请中，通过引入的带有预开发资源压缩工具的资源处理插件，对所述预加载的资源信息进行压缩处理，减少了工业互联网可视化大屏首屏打开时图像的渲染时间和文件的加载时间，从而使得用户打开工业互联网可视化大屏时，不会出现卡顿、等待动画渲染过久且出现错误异常的情况。

具体地，所述步骤S200，还包括以下步骤D100-D300：

步骤D100，获取用户当前的网速；

在本实施例中，用户当前的网速为用户在加载大屏界面时用户的网络加载速度，即用户当前的网络质量。

步骤D200，基于预设的网速划分规则，确定当前网速的网速等级；

在本实施例中，网速划分规则为自行设定的，若当前网速大于或等于预设的网速阈值时，将所述网速等级划分为第一网速等级；若当前网速小于预设的网速阈值时，将所述网速等级划分为第二网速等级，所述第一网速等级表示当前用户网速正常，所述第二网速等级表示当前用户网速过低，其中，所述第一网速等级不为0，若为0，则大屏界面显示“当前网络异常，无法加载”。需要说明的是，网速划分可以进行更精细的划分，在本实施例中，只划分第一网速等级和第二网速等级。

步骤D300，基于所述资源处理插件，对所述资源信息进行与所述网速等级相应的压缩处理方式，得到所述压缩后的资源信息，并加载所述压缩后的资源信息。

在本实施例中，所述资源处理插件，根据所述网速等级，对所述资源信息进行相应的压缩处理方式，例如，用户当前网速等级为第二网速等级，则资源处理插件在对所述资源信息压缩时，相对于第一网速等级，会将所述资源信息压缩的体积更小，以便当前网速能够更快的加载，以此提高资源加载速度。其中，将所述资源信息压缩的体积更小的方式包括代码筛查进一步筛除代码资源中的非必要变量、逻辑、空格、换行、注释等。

基于上述的第一实施例，本申请还提供另一实施例，所述可视化大屏的快速展示方法包括：

参照图4，在所述步骤S100，获取预加载的资源信息之前，所述方法包括：创建quick-open-window.js插件，即资源处理插件，在所述quick-open-window.js插件终开发图片压缩功能、文件代码压缩编译器、代码筛查工具、代码分片工具，将所述quick-open-window.js插件导入目标可视化大屏，所述quick-open-window.js自动对其预加载的资源信息进行压缩加载，以供大屏实现快速加载。

本申请还提供一种可视化大屏的快速展示装置，参照图3，所述可视化大屏的快速展示装置包括：

获取模块10，用于获取预加载的资源信息；

压缩模块20，用于基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息，其中，所述资源处理插件是预开发的资源压缩工具组成的。

可选地，所述压缩模块20，包括：

图像压缩模块，用于基于所述资源处理插件，对所述图像资源进行图像压缩，得到压缩后的图像资源；

文件压缩模块，用于对所述文件资源进行文件压缩打包处理，得到压缩打包后的文件资源；

资源压缩模块，用于基于所述压缩后的图像资源和所述压缩打包后的文件资源，得到所述压缩后的资源信息。

可选地，所述图像压缩模块，包括：

扫描模块，用于扫描所述图像资源，确定所述图像资源中像素值差值在预设范围内的像素块；

像素块合并模块，用于将所述像素块进行合并，得到所述压缩后的图像资源。

可选地，所述文件压缩模块，包括：

代码压缩模块，用于对所述文件资源进行代码压缩处理，得到代码压缩后的文件资源；

代码筛查模块，用于对所述代码压缩后的文件资源进行代码筛查，确定合规代码；

分片模块，用于将所述合规代码进行分片打包处理，得到分片打包后的文件资源。

可选地，所述打包模块，包括：

分割模块，用于基于预设的分割粒度，对所述合规代码进行代码分割，得到预设数量的代码包；

代码包合并模块，用于将所述预设数量的代码包合并至一个文件，得到所述打包后的代码资源。

可选地，所述分割模块，包括：

分离模块，用于确定所述代码资源中的第三方依赖，并将所述第三方依赖与所述业务代码分离，单独存储于一个文件空间；

第三方依赖分割模块，用于基于所述分割粒度，对所述第三方依赖进行代码分割，得到预设数量的第三方代码包。

可选地，所述压缩模块20，还包括：

网速获取模块，用于获取用户当前的网速；

网速等级确定模块，用于基于预设的网速划分规则，确定当前网速的网速等级；

压缩处理模块，用于基于和所述资源处理插件，对所述资源信息进行与所述网络等级相应的压缩处理方式，得到所述压缩后的资源信息，并加载所述压缩后的资源信息。

本申请可视化大屏的快速展示装置具体实施方式与上述可视化大屏的快速展示方法各实施例基本相同，在此不再赘述。

参照图1，图1是本申请实施例方案涉及的硬件运行环境的终端结构示意图。

可选地，该可视化大屏的快速展示设备还可以包括矩形用户接口、网络接口、摄像头、RF（Radio Frequency，射频）电路，传感器、音频电路、WiFi模块等等。矩形用户接口可以包括显示屏（Display）、输入子模块比如键盘（Keyboard），可选矩形用户接口还可以包括标准的有线接口、无线接口。网络接口可选的可以包括标准的有线接口、无线接口（如WI-FI接口）。

本领域技术人员可以理解，图1中示出的可视化大屏的快速展示设备结构并不构成对可视化大屏的快速展示设备的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

如图1所示，作为一种存储介质的存储器1005中可以包括操作系统、网络通信模块以及可视化大屏的快速展示程序。操作系统是管理和控制可视化大屏的快速展示设备硬件和软件资源的程序，支持可视化大屏的快速展示程序以及其它软件和/或程序的运行。网络通信模块用于实现存储器1005内部各组件之间的通信，以及与可视化大屏的快速展示系统中其它硬件和软件之间通信。

在图1所示的可视化大屏的快速展示设备中，处理器1001用于执行存储器1005中存储的可视化大屏的快速展示程序，实现上述任一项所述的可视化大屏的快速展示方法的步骤。

本申请可视化大屏的快速展示设备具体实施方式与上述可视化大屏的快速展示方法各实施例基本相同，在此不再赘述。

本申请还提供一种存储介质，所述存储介质上存储有实现可视化大屏的快速展示方法的程序，所述实现可视化大屏的快速展示方法的程序被处理器执行以实现如下所述可视化大屏的快速展示方法：

获取预加载的资源信息；

将所述像素块进行合并，得到所述压缩后的图像资源。

可选地，对所述文件资源进行文件压缩打包处理，得到压缩打包后的文件资源的步骤，包括：

对所述文件资源进行代码压缩处理，得到代码压缩后的文件资源；

对所述代码压缩后的文件资源进行代码筛查，确定合规代码；

将所述合规代码进行分片打包处理，得到分片打包后的文件资源。

可选地，所述将所述合规代码进行分片打包处理，得到分片打包后的文件资源的步骤，包括：

基于预设的分割粒度，对所述合规代码进行代码分割，得到预设数量的代码包；

将所述预设数量的代码包合并至一个文件，得到所述分片打包后的代码资源。

获取用户当前的网速；

基于预设的网速划分规则，确定当前网速的网速等级；

基于和所述资源处理插件，对所述资源信息进行与所述网络等级相应的压缩处理方式，得到所述压缩后的资源信息，并加载所述压缩后的资源信息。

本申请存储介质具体实施方式与上述可视化大屏的快速展示方法各实施例基本相同，在此不再赘述。

本申请还提供一种计算机程序产品、包括计算机程序，该计算机程序被处理器执行时实现上述的可视化大屏的快速展示方法的步骤。

本申请计算机程序产品的具体实施方式与上述可视化大屏的快速展示方法各实施例基本相同，在此不再赘述。

需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。

上述本申请实施例序号仅仅为了描述，不代表实施例的优劣。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在如上所述的一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，空调器，或者网络设备等)执行本申请各个实施例所述的方法。

以上仅为本申请的优选实施例，并非因此限制本申请的专利范围，凡是利用本申请说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本申请的专利保护范围内。

Claims

1.一种可视化大屏的快速展示方法，其特征在于，所述可视化大屏的快速展示方法包括：

获取预加载的资源信息；

2.如权利要求1所述的可视化大屏的快速展示方法，其特征在于，所述资源信息包括图像资源和文件资源，所述基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息的步骤，包括：

3.如权利要求2所述的可视化大屏的快速展示方法，其特征在于，所述对所述图像资源进行图像压缩，得到压缩后的图像资源的步骤，包括：

将所述像素块进行合并，得到所述压缩后的图像资源。

4.如权利要求2所述的可视化大屏的快速展示方法，其特征在于，所述文件资源包括交互操作的代码资源，对所述文件资源进行文件压缩打包处理，得到压缩打包后的文件资源的步骤，包括：

对所述代码资源进行代码筛查，确定合规代码；

5.如权利要求4所述的可视化大屏的快速展示方法，其特征在于，所述对所述代码压缩后的代码资源进行分片打包处理，得到分片打包后的文件资源的步骤，包括：

6.如权利要求5所述的可视化大屏的快速展示方法，其特征在于，所述代码资源包括第三方依赖和业务代码，所述基于预设的分割粒度，对所述代码压缩后的代码资源进行代码分割，得到预设数量的代码包的步骤，包括：

基于所述分割粒度，对所述第三方依赖进行代码分割，得到预设数量的第三方代码包；

7.如权利要求1所述的可视化大屏的快速展示方法，其特征在于，所述基于预设的资源处理插件，对所述资源信息进行压缩处理，得到压缩后的资源信息，并加载所述压缩后的资源信息的步骤，包括：

获取用户当前的网速；

基于预设的网速划分规则，确定当前网速的网速等级；

8.一种可视化大屏的快速展示装置，其特征在于，所述可视化大屏的快速展示装置包括：

获取模块，用于获取预加载的资源信息；

9.一种可视化大屏的快速展示设备，其特征在于，所述可视化大屏的快速展示设备包括：存储器、处理器以及存储在存储器上的用于实现所述可视化大屏的快速展示方法的程序，

所述处理器用于执行实现所述可视化大屏的快速展示方法的程序，以实现如权利要求1至7中任一项所述可视化大屏的快速展示方法的步骤。

10.一种存储介质，其特征在于，所述存储介质上存储有实现可视化大屏的快速展示方法的程序，所述实现可视化大屏的快速展示方法的程序被处理器执行以实现如权利要求1至7中任一项所述可视化大屏的快速展示方法的步骤。