CN111859219A - 网页骨架图的生成方法、装置、终端及存储介质 - Google Patents
网页骨架图的生成方法、装置、终端及存储介质 Download PDFInfo
- Publication number
- CN111859219A CN111859219A CN202010718720.7A CN202010718720A CN111859219A CN 111859219 A CN111859219 A CN 111859219A CN 202010718720 A CN202010718720 A CN 202010718720A CN 111859219 A CN111859219 A CN 111859219A
- Authority
- CN
- China
- Prior art keywords
- webpage
- code
- skeleton
- specified
- generating
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 51
- 238000010586 diagram Methods 0.000 claims abstract description 89
- 230000000694 effects Effects 0.000 claims description 20
- 230000004048 modification Effects 0.000 claims description 9
- 238000012986 modification Methods 0.000 claims description 9
- 230000008034 disappearance Effects 0.000 description 18
- 230000006870 function Effects 0.000 description 16
- 230000002093 peripheral effect Effects 0.000 description 10
- 230000001133 acceleration Effects 0.000 description 9
- 238000012545 processing Methods 0.000 description 9
- 230000008569 process Effects 0.000 description 7
- 238000004891 communication Methods 0.000 description 6
- 238000013461 design Methods 0.000 description 6
- 230000003287 optical effect Effects 0.000 description 6
- 239000000758 substrate Substances 0.000 description 6
- 238000004458 analytical method Methods 0.000 description 5
- 238000011161 development Methods 0.000 description 3
- 238000013473 artificial intelligence Methods 0.000 description 2
- 239000000919 ceramic Substances 0.000 description 2
- 230000006835 compression Effects 0.000 description 2
- 238000007906 compression Methods 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 2
- 238000004519 manufacturing process Methods 0.000 description 2
- 238000004806 packaging method and process Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 230000007423 decrease Effects 0.000 description 1
- 230000004927 fusion Effects 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 230000001788 irregular Effects 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 230000005055 memory storage Effects 0.000 description 1
- 238000010295 mobile communication Methods 0.000 description 1
- 230000009467 reduction Effects 0.000 description 1
- 238000009877 rendering Methods 0.000 description 1
- 230000006641 stabilisation Effects 0.000 description 1
- 238000011105 stabilization Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本公开提供了一种网页骨架图的生成方法、装置、终端及存储介质，属于计算机技术领域。所述方法包括：读取指定网页的网页配置文件，网页配置文件包括指定网页的网页骨架图的结构属性代码，用于指示网页骨架图的结构；获取网页骨架图的样式代码和执行代码；将结构属性代码、样式代码及执行代码插入到指定网页中；在对指定网页进行显示时，根据样式代码、执行代码及结构属性代码，生成网页骨架图。本公开无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
Description
技术领域
本公开涉及计算机技术领域，特别涉及一种网页骨架图的生成方法、装置、终端及存储介质。
背景技术
在用户浏览网页的过程中，由于网页内容较多，刷新时可能会产生空白页，空白页的出现严重影响了网页显示效果，降低了用户的浏览体验。为了提升用户的浏览体验，在网页加载过程中，可先将网页大致样式即网页骨架图呈现给用户，当网页加载完成后，将网页内容填充到网页骨架图相应的占位区域中，使得用户能够浏览网页内容。
目前，网页骨架图在生成时，一般采用如下方式：预先下载无头浏览器插件，该无头浏览器插件为一种没有用户界面的浏览器；基于无头浏览器插件打开HTML(Hyper TextMarkup Language，超文本标记语言)网页；根据打开的HTML网页，生成网页骨架图代码；将网页骨架图代码插入到HTML网页中；在对HTML网页进行显示时，根据网页骨架图代码，生成网页骨架图。
然而，由于需要下载无头浏览器，而无头浏览器占据的存储空间较大，导致生成网页骨架图消耗的存储资源较大。
发明内容
本公开实施例提供了一种网页骨架图的生成方法、装置、终端及存储介质。所述技术方案如下：
一方面，提供了一种网页骨架图的生成方法，所述方法包括：
读取指定网页的网页配置文件，所述网页配置文件包括所述指定网页的网页骨架图的结构属性代码，所述结构属性代码用于指示所述网页骨架图的结构；
获取所述网页骨架图的样式代码和执行代码；
将所述结构属性代码、所述样式代码及所述执行代码插入到所述指定网页中；
在对所述指定网页进行显示时，根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图。
在本公开的另一个实施例中，所述根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图之后，还包括：
当检测到对所述网页配置文件的修改操作时，获取修改后的网页配置文件；
基于修改后的网页配置文件、所述网页样式代码及所述执行代码，生成新的网页骨架图。
在本公开的另一个实施例中，所述方法还包括：
当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图消失。
在本公开的另一个实施例中，所述当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图消失，包括：
当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图采用预设效果消失。
在本公开的另一个实施例中，所述读取指定网页的网页配置文件之前，还包括：
根据所述指定网页的尺寸，生成所述结构属性代码，所述结构属性代码指示的所述网页骨架图的尺寸与所述尺寸相匹配。
在本公开的另一个实施例中，所述根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图之后，还包括：
根据终端的屏幕尺寸，调整所述网页骨架图的尺寸。
另一方面，提供了一种网页骨架图的生成装置，所述装置包括：
读取模块，用于读取指定网页的网页配置文件，所述网页配置文件包括所述指定网页的网页骨架图的结构属性代码，所述结构属性代码用于指示所述网页骨架图的结构；
获取模块，用于获取所述网页骨架图的样式代码和执行代码；
插入模块，用于将所述结构属性代码、所述样式代码及所述执行代码插入到所述指定网页中；
生成模块，用于在对所述指定网页进行显示时，根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图。
在本公开的另一个实施例中，
获取模块，还用于当检测到对所述网页配置文件的修改操作时，获取修改后的网页配置文件；
生成模块，还用于基于修改后的网页配置文件、所述网页样式代码及所述执行代码，生成新的网页骨架图。
在本公开的另一个实施例中，所述装置还包括：
控制模块，用于当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图消失。
在本公开的另一个实施例中，所述控制模块，用于当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图采用预设效果消失。
在本公开的另一个实施例中，
生成模块，还用于根据所述指定网页的尺寸，生成所述结构属性代码，所述结构属性代码指示的所述网页骨架图的尺寸与所述尺寸相匹配。
在本公开的另一个实施例中，所述装置还包括：
调整模块，用于根据终端的屏幕尺寸，调整所述网页骨架图的尺寸。
本公开实施例提供的技术方案带来的有益效果是：
无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
附图说明
为了更清楚地说明本公开实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1是本公开实施例提供的一种网页骨架图的生成方法流程图；
图2是本公开实施例提供的一种网页骨架图的生成方法流程图；
图3是本公开实施例提供的一种网页骨架图的生成装置结构示意图；
图4示出了本公开一个示例性实施例提供的终端的结构框图。
具体实施方式
为使本公开的目的、技术方案和优点更加清楚，下面将结合附图对本公开实施方式作进一步地详细描述。
可以理解，本公开实施例所使用的术语“每个”、“多个”及“任一”等，多个包括两个或两个以上，每个是指对应的多个中的每一个，任一是指对应的多个中的任意一个。举例来说，多个词语包括10个词语，而每个词语是指这10个词语中的每一个词语，任一词语是指10个词语中的任意一个词语。
本公开实施例提供了一种网页骨架图的生成方法，参见图1，本公开实施例提供的方法流程包括：
101、读取指定网页的网页配置文件，网页配置文件包括指定网页的网页骨架图的结构属性代码，结构属性代码用于指示网页骨架图的结构。
102、获取网页骨架图的样式代码和执行代码。
103、将结构属性代码、样式代码及执行代码插入到指定网页中。
104、在对指定网页进行显示时，根据样式代码、执行代码及结构属性代码，生成网页骨架图。
本公开实施例提供的方法，无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
在本公开的另一个实施例中，根据样式代码、执行代码及结构属性代码，生成网页骨架图之后，还包括：
当检测到对网页配置文件的修改操作时，获取修改后的网页配置文件；
基于修改后的网页配置文件、网页样式代码及执行代码，生成新的网页骨架图。
在本公开的另一个实施例中，该方法还包括：
当检测到网页骨架图的显示时间达到预设时间时，控制网页骨架图消失。
在本公开的另一个实施例中，当检测到网页骨架图的显示时间达到预设时间时，控制网页骨架图消失，包括：
当检测到网页骨架图的显示时间达到预设时间时，控制网页骨架图采用预设效果消失。
在本公开的另一个实施例中，读取指定网页的网页配置文件之前，还包括：
根据指定网页的尺寸，生成结构属性代码，结构属性代码指示的网页骨架图的尺寸与尺寸相匹配。
在本公开的另一个实施例中，根据样式代码、执行代码及结构属性代码，生成网页骨架图之后，还包括：
根据终端的屏幕尺寸，调整网页骨架图的尺寸。
上述所有可选技术方案，可以采用任意结合形成本公开的可选实施例，在此不再一一赘述。
本公开实施例提供了一种网页骨架图的生成方法，本公开实施例提供的方法应用于终端中，参见图2，本公开实施例提供的方法流程包括：
201、终端读取指定网页的网页配置文件。
其中，终端可以为平板电脑、台式电脑、笔记本电脑等设备，本公开实施例不对终端的产品类型作具体的限定。
指定网页为待发布的网页，该指定网页可以为应用程序中的原生页面，也可以为HTML5页面等。
网页配置文件为网页骨架图生成时所需要的文件，该网页配置文件包括指定网页的网页骨架图的结构属性代码，该结构属性代码用于指示网页骨架图的结构，网页骨架图的结构包括网页骨架图中每个占位区域的形状及尺寸等等。
终端读取指定网页的网页配置文件时，可采用指定接口读取网页配置文件，该指定接口可以为webpack，该webpack为一种开源的前端打包工具。
在本公开的另一个实施例中，终端在读取指定网页的网页配置文件之前，还将根据指定网页的尺寸，生成结构属性代码，从而得到网页配置文件。其中，结构属性代码指示的网页骨架图的尺寸与指定网页的尺寸相匹配。该相匹配的含义可以为网页骨架图的尺寸与指定网页的尺寸相同，例如，指定网页的宽为20个单位，高为30个单位，则网页骨架图的尺寸可以为宽20个单位，高30个单位；该相匹配的含义还可以为网页骨架图的尺寸与指定网页的尺寸比例相同，例如，指定网页的宽高比为2:3，则网页骨架图的宽高比也可以为2:3。
在本公开的另一个实施例中，终端可以提供指定网页设计图的宽和高输入选项，基于该网页设计图的宽和高输入选项，前端开发人员可自行输入指定网页的宽和高尺寸，终端检测前端开发人员的输入操作，获取指定网页的宽和高的尺寸，作为指定网页的尺寸，并根据指定网页的尺寸，确定出网页骨架图的尺寸，该网页骨架图的尺寸与该指定网页的尺寸相匹配。
本公开实施例提供的方法通过提供指定网页的宽和高输入选项，使得前端开发人员能够自行设计网页尺寸，从而获取满足前端开发人员需求的网页。对于前端开发人员来说，只需要简单按照规范填写相关配置，无需进行其他额外操作，即可生成风格统一、过度平滑的网页骨架图，极大缩短了网页骨架图的制作时间、降低了网页骨架图的制作难度和风险，而且提高了用户的体验效果，向用户提供了页面加载更为舒适的体验效果。
202、终端获取网页骨架图的样式代码和执行代码。
其中，样式代码可以为CSS(Cascading Style Sheets，层叠样式表)代码，与网页骨架图的结构代码不同，该样式代码用于对指定网页的内容进行修饰，例如，指示指定网页的颜色、字体、排版等显示特性。执行代码可以为JavaScript代码，该JavaScript代码能够触发执行网页显示过程，该JavaScript代码包括指定网页的图片节点信息和文字节点信息等。
终端在获取网页骨架图的样式代码时，可采用如下方式：对指定网页的源代码进行CSS解析，通过对指定网页的源代码进行CSS解析，得到网页骨架图的CSS代码。
终端在获取网页骨架图的执行代码时，可采用如下方式：对指定网页的源代码进行JavaScript解析，通过对指定网页的源代码进行JavaScript解析，得到网页骨架图的JavaScript代码，并在解析过程中可实时从指定网页中获取该网页的属性信息，该网页属性信息中包括指定网页的图片节点信息和文字节点信息等。
203、终端将结构属性代码、样式代码及执行代码插入到指定网页中。
在网页开发过程中，终端可采用webpack对获取到的结构属性代码、样式代码及执行代码进行打包，通过对指定网页的结构属性代码、样式代码及执行代码进行打包，能够将结构属性代码、样式代码及执行代码插入到指定网页中。
204、在对指定网页进行显示时，终端根据样式代码、执行代码及结构属性代码，生成网页骨架图。
将结构属性代码、样式代码及执行代码插入到指定网页之后，当接收到对指定网页的显示指令，终端通过执行网页骨架图的样式代码、执行代码及结构属性代码，生成指定网页的网页骨架图，并显示所生成的指定网页的网页骨架图。
在网页开发过程中，如果根据样式代码、执行代码及结构属性代码生成的网页骨架图与指定网页设计图存在偏差，前端开发人员可对网页配置文件进行修改，当检测到对网页配置文件的修改操作时，终端获取修改后的网页配置文件，并基于修改后的网页配置文件、网页样式代码及执行代码，生成新的网页骨架图。
由于本公开实施例提供的方法能够实时显示所生成的网页骨架图，因而无需将网页骨架图发布后根据显示效果，再对网页骨架图代码进行二次修改，本公开实施例提供的方法在开发环境中通过修改网页配置文件，即可对所生成的网页骨架图进行更改，采用该种方式，完全解耦了网页骨架图开发和项目开发的关联，克服了网页骨架图生成、调试困难的问题，简化了网页骨架图的生成及调试过程。
在本公开的另一个实施例中，终端可以提供第一消失控制函数，该第一消失控制函数用于控制网页骨架图的消失时间，当网页内容加载完成，通过调用该第一消失函数，可控制网页骨架图消失，从而避免显示的网页骨架图对用户的浏览产生干扰。具体实施时，终端可记录网页骨架图的显示时间，当检测到网页骨架图的显示时间达到预设时间时，调用该第一消失控制函数，通过调用第一消失控制函数，控制所显示的网页骨架图消失。其中，预设时间可以为网页内容的加载时长，该预设时长根据网络状况及网页内容确定，当网页状况较佳，且网页内容较少时，该预设时间可以相对较短；当网络状况较差，且网页内容较多时，该预设时间可以相对较长。通常该预设时间可以为1秒、2秒等。
在本公开的另一个实施例中，终端还可以提供第二消失控制函数，该第二消失控制函数用于控制网页骨架图消失时的消失效果，通过调用第二消失控制函数控制网页骨架图消失，可以增加指定网页显示过程的趣味性。具体实施时，当检测到网页骨架图的显示时间达到预设时间时，终端调用第二消失控制函数，通过调用第二消失控制函数，可控制网页骨架图采用预设效果消失。其中，预设效果可以为淡入、淡出等等。
进一步地，在网页骨架图采用预设效果消失的同时，网页内容也可采用指定效果出现。例如，当检测到网页骨架图的消失时间达到预设时间时，网页骨架图可采用淡出效果消失，网页内容可采用淡入效果出现；当检测到网页骨架图的消失时间达到预设时间，网页骨架图可采用淡入效果消失，网页内容可采用淡出效果出现等等。
本公开实施例提供的方法通过提供第一消失控制函数和第二消失控制函数，可使前端开发人员实现所需要呈现的效果。
205、终端根据终端的屏幕尺寸，调整网页骨架图的尺寸。
基于所生成的网页骨架图，终端还将根据终端的屏幕尺寸，调整网页骨架图的尺寸，使得调整后的网页骨架图的尺寸，能够满足不同屏幕尺寸的终端的显示需求。
采用该种方式可以自动生成满足屏幕自适应的网页骨架图，通过将首屏显示和自适应相结合，前端开发人员只需根据网页设计图尺寸对网页骨架图进行配置即可。
本公开实施例提供的方法，无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
参见图3，本公开实施例提供了一种网页骨架图的生成装置，该装置包括：
读取模块301，用于读取指定网页的网页配置文件，网页配置文件包括指定网页的网页骨架图的结构属性代码，结构属性代码用于指示网页骨架图的结构；
获取模块302，用于获取网页骨架图的样式代码和执行代码；
插入模块303，用于将结构属性代码、样式代码及执行代码插入到指定网页中；
生成模块304，用于在对指定网页进行显示时，根据样式代码、执行代码及结构属性代码，生成网页骨架图。
在本公开的另一个实施例中，
获取模块302，还用于当检测到对网页配置文件的修改操作时，获取修改后的网页配置文件；
生成模块304，还用于基于修改后的网页配置文件、网页样式代码及执行代码，生成新的网页骨架图。
在本公开的另一个实施例中，
控制模块，用于当检测到网页骨架图的显示时间达到预设时间时，控制网页骨架图消失。
在本公开的另一个实施例中，
控制模块，用于当检测到网页骨架图的显示时间达到预设时间时，控制网页骨架图采用预设效果消失。
在本公开的另一个实施例中，
生成模块304，还用于根据指定网页的尺寸，生成结构属性代码，结构属性代码指示的网页骨架图的尺寸与尺寸相匹配。
在本公开的另一个实施例中，该装置还包括：
调整模块，用于根据终端的屏幕尺寸，调整网页骨架图的尺寸。
综上，本公开实施例提供的装置，无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
图4示出了本公开一个示例性实施例提供的终端400的结构框图。该终端400可以是：智能手机、平板电脑、MP3播放器(Moving Picture Experts Group Audio Layer III，动态影像专家压缩标准音频层面3)、MP4(Moving Picture Experts Group Audio LayerIV，动态影像专家压缩标准音频层面4)播放器、笔记本电脑或台式电脑。终端400还可能被称为用户设备、便携式终端、膝上型终端、台式终端等其他名称。
通常，终端400包括有：处理器401和存储器402。
处理器401可以包括一个或多个处理核心，比如4核心处理器、8核心处理器等。处理器401可以采用DSP(Digital Signal Processing，数字信号处理)、FPGA(Field－Programmable Gate Array，现场可编程门阵列)、PLA(Programmable Logic Array，可编程逻辑阵列)中的至少一种硬件形式来实现。处理器401也可以包括主处理器和协处理器，主处理器是用于对在唤醒状态下的数据进行处理的处理器，也称CPU(Central ProcessingUnit，中央处理器)；协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中，处理器401可以在集成有GPU(Graphics Processing Unit，图像处理器)，GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中，处理器401还可以包括AI(Artificial Intelligence，人工智能)处理器，该AI处理器用于处理有关机器学习的计算操作。
存储器402可以包括一个或多个计算机可读存储介质，该计算机可读存储介质可以是非暂态的。存储器402还可包括高速随机存取存储器，以及非易失性存储器，比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中，存储器402中的非暂态的计算机可读存储介质用于存储至少一个指令，该至少一个指令用于被处理器401所执行以实现本申请中方法实施例提供的网页骨架图的生成方法。
在一些实施例中，终端400还可选包括有：外围设备接口403和至少一个外围设备。处理器401、存储器402和外围设备接口403之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口403相连。具体地，外围设备包括：射频电路404、显示屏405、摄像头组件406、音频电路407、定位组件408和电源409中的至少一种。
外围设备接口403可被用于将I/O(Input/Output，输入/输出)相关的至少一个外围设备连接到处理器401和存储器402。在一些实施例中，处理器401、存储器402和外围设备接口403被集成在同一芯片或电路板上；在一些其他实施例中，处理器401、存储器402和外围设备接口403中的任意一个或两个可以在单独的芯片或电路板上实现，本实施例对此不加以限定。
射频电路404用于接收和发射RF(Radio Frequency，射频)信号，也称电磁信号。射频电路404通过电磁信号与通信网络以及其他通信设备进行通信。射频电路404将电信号转换为电磁信号进行发送，或者，将接收到的电磁信号转换为电信号。可选地，射频电路404包括：天线系统、RF收发器、一个或多个放大器、调谐器、振荡器、数字信号处理器、编解码芯片组、用户身份模块卡等等。射频电路404可以通过至少一种无线通信协议来与其它终端进行通信。该无线通信协议包括但不限于：城域网、各代移动通信网络(2G、3G、4G及5G)、无线局域网和/或WiFi(Wireless Fidelity，无线保真)网络。在一些实施例中，射频电路404还可以包括NFC(Near Field Communication，近距离无线通信)有关的电路，本申请对此不加以限定。
显示屏405用于显示UI(User Interface，用户界面)。该UI可以包括图形、文本、图标、视频及其它们的任意组合。当显示屏405是触摸显示屏时，显示屏405还具有采集在显示屏405的表面或表面上方的触摸信号的能力。该触摸信号可以作为控制信号输入至处理器401进行处理。此时，显示屏405还可以用于提供虚拟按钮和/或虚拟键盘，也称软按钮和/或软键盘。在一些实施例中，显示屏405可以为一个，设置终端400的前面板；在另一些实施例中，显示屏405可以为至少两个，分别设置在终端400的不同表面或呈折叠设计；在再一些实施例中，显示屏405可以是柔性显示屏，设置在终端400的弯曲表面上或折叠面上。甚至，显示屏405还可以设置成非矩形的不规则图形，也即异形屏。显示屏405可以采用LCD(LiquidCrystal Display，液晶显示屏)、OLED(Organic Light-Emitting Diode,有机发光二极管)等材质制备。
摄像头组件406用于采集图像或视频。可选地，摄像头组件406包括前置摄像头和后置摄像头。通常，前置摄像头设置在终端的前面板，后置摄像头设置在终端的背面。在一些实施例中，后置摄像头为至少两个，分别为主摄像头、景深摄像头、广角摄像头、长焦摄像头中的任意一种，以实现主摄像头和景深摄像头融合实现背景虚化功能、主摄像头和广角摄像头融合实现全景拍摄以及VR(Virtual Reality，虚拟现实)拍摄功能或者其它融合拍摄功能。在一些实施例中，摄像头组件406还可以包括闪光灯。闪光灯可以是单色温闪光灯，也可以是双色温闪光灯。双色温闪光灯是指暖光闪光灯和冷光闪光灯的组合，可以用于不同色温下的光线补偿。
音频电路407可以包括麦克风和扬声器。麦克风用于采集用户及环境的声波，并将声波转换为电信号输入至处理器401进行处理，或者输入至射频电路404以实现语音通信。出于立体声采集或降噪的目的，麦克风可以为多个，分别设置在终端400的不同部位。麦克风还可以是阵列麦克风或全向采集型麦克风。扬声器则用于将来自处理器401或射频电路404的电信号转换为声波。扬声器可以是传统的薄膜扬声器，也可以是压电陶瓷扬声器。当扬声器是压电陶瓷扬声器时，不仅可以将电信号转换为人类可听见的声波，也可以将电信号转换为人类听不见的声波以进行测距等用途。在一些实施例中，音频电路407还可以包括耳机插孔。
定位组件408用于定位终端400的当前地理位置，以实现导航或LBS(LocationBased Service，基于位置的服务)。定位组件408可以是基于美国的GPS(GlobalPositioning System，全球定位系统)、中国的北斗系统、俄罗斯的格雷纳斯系统或欧盟的伽利略系统的定位组件。
电源409用于为终端400中的各个组件进行供电。电源409可以是交流电、直流电、一次性电池或可充电电池。当电源409包括可充电电池时，该可充电电池可以支持有线充电或无线充电。该可充电电池还可以用于支持快充技术。
在一些实施例中，终端400还包括有一个或多个传感器410。该一个或多个传感器410包括但不限于：加速度传感器411、陀螺仪传感器412、压力传感器413、指纹传感器414、光学传感器415以及接近传感器416。
加速度传感器411可以检测以终端400建立的坐标系的三个坐标轴上的加速度大小。比如，加速度传感器411可以用于检测重力加速度在三个坐标轴上的分量。处理器401可以根据加速度传感器411采集的重力加速度信号，控制显示屏405以横向视图或纵向视图进行用户界面的显示。加速度传感器411还可以用于游戏或者用户的运动数据的采集。
陀螺仪传感器412可以检测终端400的机体方向及转动角度，陀螺仪传感器412可以与加速度传感器411协同采集用户对终端400的3D动作。处理器401根据陀螺仪传感器412采集的数据，可以实现如下功能：动作感应(比如根据用户的倾斜操作来改变UI)、拍摄时的图像稳定、游戏控制以及惯性导航。
压力传感器413可以设置在终端400的侧边框和/或显示屏405的下层。当压力传感器413设置在终端400的侧边框时，可以检测用户对终端400的握持信号，由处理器401根据压力传感器413采集的握持信号进行左右手识别或快捷操作。当压力传感器413设置在显示屏405的下层时，由处理器401根据用户对显示屏405的压力操作，实现对UI界面上的可操作性控件进行控制。可操作性控件包括按钮控件、滚动条控件、图标控件、菜单控件中的至少一种。
指纹传感器414用于采集用户的指纹，由处理器401根据指纹传感器414采集到的指纹识别用户的身份，或者，由指纹传感器414根据采集到的指纹识别用户的身份。在识别出用户的身份为可信身份时，由处理器401授权该用户执行相关的敏感操作，该敏感操作包括解锁屏幕、查看加密信息、下载软件、支付及更改设置等。指纹传感器414可以被设置终端400的正面、背面或侧面。当终端400上设置有物理按键或厂商Logo时，指纹传感器414可以与物理按键或厂商Logo集成在一起。
光学传感器415用于采集环境光强度。在一个实施例中，处理器401可以根据光学传感器415采集的环境光强度，控制显示屏405的显示亮度。具体地，当环境光强度较高时，调高显示屏405的显示亮度；当环境光强度较低时，调低显示屏405的显示亮度。在另一个实施例中，处理器401还可以根据光学传感器415采集的环境光强度，动态调整摄像头组件406的拍摄参数。
接近传感器416，也称距离传感器，通常设置在终端400的前面板。接近传感器416用于采集用户与终端400的正面之间的距离。在一个实施例中，当接近传感器416检测到用户与终端400的正面之间的距离逐渐变小时，由处理器401控制显示屏405从亮屏状态切换为息屏状态；当接近传感器416检测到用户与终端400的正面之间的距离逐渐变大时，由处理器401控制显示屏405从息屏状态切换为亮屏状态。
本领域技术人员可以理解，图4中示出的结构并不构成对终端400的限定，可以包括比图示更多或更少的组件，或者组合某些组件，或者采用不同的组件布置。
本公开实施例提供的终端，无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
本公开实施例提供了一种计算机可读存储介质，所述存储介质中存储有至少一条程序代码，所述至少一条程序代码由处理器加载并执行，以实现图1或图2所示的网页骨架图的生成方法。该计算机可读存储介质可以是非暂态的。例如，该计算机可读存储介质可以是只读存储器(Read-Only Memory,ROM)、随机存取存储器(Random Access Memory,RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
本公开实施例提供的计算机可读存储介质，无需下载额外的浏览器，通过读取包括网页骨架图的结构属性代码的指定网页的网页配置文件，即可得到网页骨架图的结构，通过执行网页骨架图相关的代码，将网页骨架图相关代码插入到指定网页中，降低了网页骨架图生成时所消耗的存储资源。
本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成，也可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，上述提到的存储介质可以是只读存储器，磁盘或光盘等。
以上所述仅为本公开的较佳实施例，并不用以限制本公开，凡在本公开的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本公开的保护范围之内。
Claims (14)
1.一种网页骨架图的生成方法，其特征在于，所述方法包括：
读取指定网页的网页配置文件，所述网页配置文件包括所述指定网页的网页骨架图的结构属性代码，所述结构属性代码用于指示所述网页骨架图的结构；
获取所述网页骨架图的样式代码和执行代码；
将所述结构属性代码、所述样式代码及所述执行代码插入到所述指定网页中；
在对所述指定网页进行显示时，根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图。
2.根据权利要求1所述的方法，其特征在于，所述根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图之后，还包括：
当检测到对所述网页配置文件的修改操作时，获取修改后的网页配置文件；
基于修改后的网页配置文件、所述网页样式代码及所述执行代码，生成新的网页骨架图。
3.根据权利要求1所述的方法，其特征在于，所述方法还包括：
当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图消失。
4.根据权利要求3所述的方法，其特征在于，所述当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图消失，包括：
当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图采用预设效果消失。
5.根据权利要求1所述的方法，其特征在于，所述读取指定网页的网页配置文件之前，还包括：
根据所述指定网页的尺寸，生成所述结构属性代码，所述结构属性代码指示的所述网页骨架图的尺寸与所述尺寸相匹配。
6.根据权利要求1所述的方法，其特征在于，所述根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图之后，还包括：
根据终端的屏幕尺寸，调整所述网页骨架图的尺寸。
7.一种网页骨架图的生成装置，其特征在于，所述装置包括：
读取模块，用于读取指定网页的网页配置文件，所述网页配置文件包括所述指定网页的网页骨架图的结构属性代码，所述结构属性代码用于指示所述网页骨架图的结构；
获取模块，用于获取所述网页骨架图的样式代码和执行代码；
插入模块，用于将所述结构属性代码、所述样式代码及所述执行代码插入到所述指定网页中；
生成模块，用于在对所述指定网页进行显示时，根据所述样式代码、所述执行代码及所述结构属性代码，生成网页骨架图。
8.根据权利要求7所述的装置，其特征在于，
获取模块，还用于当检测到对所述网页配置文件的修改操作时，获取修改后的网页配置文件；
生成模块，还用于基于修改后的网页配置文件、所述网页样式代码及所述执行代码，生成新的网页骨架图。
9.根据权利要求7所述的装置，其特征在于，所述装置还包括：
控制模块，用于当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图消失。
10.根据权利要求9所述的装置，其特征在于，所述控制模块，用于当检测到所述网页骨架图的显示时间达到预设时间时，控制所述网页骨架图采用预设效果消失。
11.根据权利要求7所述的装置，其特征在于，
生成模块，还用于根据所述指定网页的尺寸，生成所述结构属性代码，所述结构属性代码指示的所述网页骨架图的尺寸与所述尺寸相匹配。
12.根据权利要求7所述的装置，其特征在于，所述装置还包括：
调整模块，用于根据终端的屏幕尺寸，调整所述网页骨架图的尺寸。
13.一种终端，其特征在于，所述终端包括处理器和存储器，所述存储器中存储有至少一条程序代码，所述至少一条程序代码由所述处理器加载并执行，以实现如权利要求1至6中任一项所述的网页骨架图的生成方法。
14.一种计算机可读存储介质，其特征在于，所述存储介质中存储有至少一条程序代码，所述至少一条程序代码由处理器加载并执行，以实现如权利要求1至6中任一项所述的网页骨架图的生成方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010718720.7A CN111859219A (zh) | 2020-07-23 | 2020-07-23 | 网页骨架图的生成方法、装置、终端及存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010718720.7A CN111859219A (zh) | 2020-07-23 | 2020-07-23 | 网页骨架图的生成方法、装置、终端及存储介质 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111859219A true CN111859219A (zh) | 2020-10-30 |
Family
ID=72951154
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010718720.7A Pending CN111859219A (zh) | 2020-07-23 | 2020-07-23 | 网页骨架图的生成方法、装置、终端及存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111859219A (zh) |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109558133A (zh) * | 2018-12-03 | 2019-04-02 | 咪咕数字传媒有限公司 | 一种页面处理方法、装置和存储介质 |
| CN109977333A (zh) * | 2019-03-22 | 2019-07-05 | 北京三快在线科技有限公司 | 网页显示方法、装置、计算机设备及存储介质 |
| CN110110263A (zh) * | 2019-05-13 | 2019-08-09 | 北京三快在线科技有限公司 | 网页显示方法、装置、终端及存储介质 |
| CN110442811A (zh) * | 2019-08-14 | 2019-11-12 | 广州虎牙科技有限公司 | 一种页面的处理方法、装置、计算机设备和存储介质 |
| CN110543350A (zh) * | 2019-09-09 | 2019-12-06 | 广州华多网络科技有限公司 | 一种生成页面组件的方法及装置 |
| CN111124574A (zh) * | 2019-12-18 | 2020-05-08 | 南京三百云信息科技有限公司 | 首屏渲染加速方法、开发端、服务器、系统和电子设备 |
-
2020
- 2020-07-23 CN CN202010718720.7A patent/CN111859219A/zh active Pending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109558133A (zh) * | 2018-12-03 | 2019-04-02 | 咪咕数字传媒有限公司 | 一种页面处理方法、装置和存储介质 |
| CN109977333A (zh) * | 2019-03-22 | 2019-07-05 | 北京三快在线科技有限公司 | 网页显示方法、装置、计算机设备及存储介质 |
| CN110110263A (zh) * | 2019-05-13 | 2019-08-09 | 北京三快在线科技有限公司 | 网页显示方法、装置、终端及存储介质 |
| CN110442811A (zh) * | 2019-08-14 | 2019-11-12 | 广州虎牙科技有限公司 | 一种页面的处理方法、装置、计算机设备和存储介质 |
| CN110543350A (zh) * | 2019-09-09 | 2019-12-06 | 广州华多网络科技有限公司 | 一种生成页面组件的方法及装置 |
| CN111124574A (zh) * | 2019-12-18 | 2020-05-08 | 南京三百云信息科技有限公司 | 首屏渲染加速方法、开发端、服务器、系统和电子设备 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN109977333B (zh) | 网页显示方法、装置、计算机设备及存储介质 | |
| CN109359262B (zh) | 动画播放方法、装置、终端及存储介质 | |
| CN111880712B (zh) | 页面显示方法、装置、电子设备及存储介质 | |
| CN110321126B (zh) | 生成页面代码的方法和装置 | |
| CN109327608B (zh) | 歌曲分享的方法、终端、服务器和系统 | |
| CN109144346B (zh) | 歌曲分享方法、装置及存储介质 | |
| WO2022134632A1 (zh) | 作品处理方法及装置 | |
| CN110288689B (zh) | 对电子地图进行渲染的方法和装置 | |
| CN113409427B (zh) | 动画播放方法、装置、电子设备及计算机可读存储介质 | |
| CN108734662B (zh) | 显示图标的方法和装置 | |
| CN112257006B (zh) | 页面信息的配置方法、装置、设备及计算机可读存储介质 | |
| CN108845777B (zh) | 播放帧动画的方法和装置 | |
| CN108038232B (zh) | 网页编辑方法、装置和系统、存储介质 | |
| CN110769120A (zh) | 进行消息提醒的方法、装置、设备及存储介质 | |
| CN110868642B (zh) | 视频播放方法、装置及存储介质 | |
| CN109783176B (zh) | 切换页面的方法和装置 | |
| CN109614563B (zh) | 显示网页的方法、装置、设备及存储介质 | |
| CN108664300B (zh) | 一种画中画模式下的应用界面显示方法及装置 | |
| CN110889060A (zh) | 网页显示方法、装置、计算机设备及存储介质 | |
| CN111083554A (zh) | 直播礼物显示的方法和装置 | |
| CN110992268B (zh) | 背景设置方法、装置、终端及存储介质 | |
| CN113301422B (zh) | 获取视频封面的方法、终端及存储介质 | |
| CN110045999B (zh) | 绘制组件的方法、装置、终端和存储介质 | |
| CN111464829B (zh) | 切换媒体数据的方法、装置、设备及存储介质 | |
| CN109101166B (zh) | 音频控制方法、装置及存储介质 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |