用于页面中字符渲染的方法、装置、设备和系统制造方法及图纸

本公开的各实施例的目的是提供一种用于页面中字符渲染的方法、装置、设备和系统。用户设备获取页面中待加载字符的编码信息和文本样式信息，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；根据所述字体标识信息和所述编码信息从字体库获取对应字形的SVG图形信息；根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染。本公开的各实施例将字体文件的所有字形预先全部转成SVG图形信息，在对web页面渲染时，动态获取页面中的字符对应的字形SVG图形信息，从而实现按需加载。从而实现按需加载。从而实现按需加载。

【技术实现步骤摘要】
用于页面中字符渲染的方法、装置、设备和系统


[0001]本公开的各实施例涉及页面渲染
，尤其涉及一种用于页面中字符渲染的技术。

技术介绍

[0002]Web页面中经常需要引入一些特殊字体，这些字体不在终端设备的系统字体库的范围内，因此需要在加载页面时从网络下载，而字体文件通常都需要好几MB的体积，在网速不够好的情况下，会影响加载体验，例如会出现加载不出字体的情况。
[0003]针对这种情况，现有的解决方案是字体裁剪技术。字体裁剪技术是指对字体文件进行裁剪来获得一个较小的字体库，即从庞大的字体库中筛选出部分需要的字符，获得一个包含更少字符的子集，从而减少字体文件的大小，降低其包体占用和内存开销。
[0004]然而，字体裁剪技术仍然存在一些问题：若裁剪后字体库包含的字符数较少，会出现在使用中缺少部分字符的情况；反之，若裁剪后字体库包含的字符数较多，则字体文件的体积仍会较大。此外，由于字体库需要兼顾所有用户对字符的渲染，因此裁剪后字体库所包含的字符数总是会多于单个用户实际渲染所需的字符数。

技术实现思路

[0005]本公开的各实施例的目的是提供一种用于页面中字符渲染的方法、装置、设备和系统。
[0006]根据本公开的一个方面，提供了一种用于页面中字符渲染的方法，其中，在用户设备端，该方法包括以下步骤：
[0007]获取页面中待加载字符的编码信息和文本样式信息，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；
[0008]根据所述字体标识信息和所述编码信息从字体库获取对应字形的SVG图形信息；
[0009]根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染。
[0010]根据本公开的一个方面，还提供了一种在用户设备端用于页面中字符渲染的装置，其中，该装置包括：
[0011]用于获取页面中待加载字符的编码信息和文本样本信息的装置，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；
[0012]用于根据所述字体标识信息和所述编码信息从字体库获取对应字形的SVG图形信息的装置；
[0013]用于根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染的装置。
[0014]根据本公开的一个方面，还提供了一种用于页面中字符渲染的设备，其中，该设备包括处理器和存储器，所述存储器包括计算机可执行指令，当所述计算机可执行指令被所述处理器执行时，该设备被配置来执行以下操作：
[0015]获取页面中待加载字符的编码信息和文本样本信息，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；
[0016]根据所述字体标识信息和所述编码信息从字体库获取对应字形的SVG图形信息；
[0017]根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染。
[0018]根据本公开的一个方面，还提供了一种用于页面中字符渲染的系统，其中，该系统包括用户设备和网络设备；其中，
[0019]所述用户设备包括第一处理器和第一存储器，所述第一存储器包括第一计算机可执行指令，当所述第一计算机可执行指令被所述第一处理器执行时，所述用户设备被配置来执行以下操作：
[0020]获取页面中待加载字符的编码信息和文本样本信息，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；
[0021]根据所述字体标识信息和所述编码信息从云端字体库获取对应字形的SVG图形信息；
[0022]根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染；
[0023]所述网络设备包括第二处理器和第二存储器，所述第二存储器包括第二计算机可执行指令，当所述第二计算机可执行指令被所述第二处理器执行时，所述网络设备被配置来执行以下操作：
[0024]获取并解析字体文件，从所述字体文件中提取各字符的编码信息、字形轮廓信息以及所属字形的度量信息；
[0025]将所述字形轮廓信息转换为对应字形的SVG图形信息并将所述度量信息写入所述SVG图形信息的属性中；
[0026]将所述字形的SVG图形信息与其字符的编码信息关联存储至所述云端字体库的对应字体集，以建立或更新所述云端字体库。
[0027]本公开的各实施例将字体文件的所有字形预先全部转成SVG图形信息，在对web页面渲染时，动态获取页面中的字符对应的字形SVG图形信息，从而实现按需加载。其中，每个SVG图形信息仅几KB大小，显著减少了需要加载的字体文件的体积，并且，每个用户在实际页面渲染时只需要获取需要渲染的字形对应的SVG图形信息，而不需要加载额外字形的SVG图形信息。
附图说明
[0028]通过阅读参照以下附图所作的对非限制性实施例所作的详细描述，本公开的其它特征、目的和优点将会变得更明显：
[0029]图1示出根据本公开的一种示例性的在用户设备端对页面中字符进行渲染的方法流程图；
[0030]图2示出根据本公开的一种示例性的加载字符“哔哩哔哩乾杯”的示意图；
[0031]图3示出根据本公开的一个实施例的在网络设备端建立云端字体库的方法流程图；
[0032]图4示出根据本公开的一个实施例在用户设备端对页面中字符进行渲染的装置的示意图。
[0033]附图中相同或相似的附图标记代表相同或相似的部件。
具体实施方式
[0034]以下将结合附图来进一步描述本公开的具体实施例。
[0035]在更加详细地讨论示例性实施例之前应当提到的是，本公开的一些示例性实施例被描述为由方框图表述的装置和由流程图表述的过程或方法。虽然流程图将本公开的各实施例的操作过程描述成顺序的处理，但是其中的许多操作可以被并行地、并发地或者同时实施。此外，各项操作的顺序可以被重新安排。本公开的各实施例的过程可在其操作执行完毕时被终止，但也可包括未在所述流程图中示出的额外步骤。本公开的各实施例的过程可以对应于方法、功能、规程、子例程、子程序等。
[0036]以下讨论的由流程图示出的方法和由方框图示出的装置，可以通过硬件、软件、固件、中间件、微代码、硬件描述语言、或其任意组合实现。当以软件、固件、中间件或微代码实现时，执行必要任务的程序代码或代码段可被存储于机器或诸如存储介质的计算机可读介质。(一个或多个)处理器可以执行所述必要任务。
[0037]类似地，还将理解任何流程表、流程图、状态转换图，诸如此类，表示各种过程，其可以被充分地描述为存储于计算机可读介质内的程序代码并因此被计算机设备或处理器执行，无论这些计算机设备或处理器是否被明确示出。
[0038]本文中，术语“存储介质”可以表示一个或多个用于存储数据的设备，包括只读存储器(ROM)，随机存取存储器(RAM)，磁性RAM，内核存储器，磁盘存储介质，光存储介质，闪存设备和/或其他用于存储信息的机器可读介质。术语“计算机可读介质”可包括但不限于，便携的或固定本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种用于页面中字符渲染的方法，其中，在用户设备端，该方法包括以下步骤：获取页面中待加载字符的编码信息和文本样式信息，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；根据所述字体标识信息和所述编码信息从字体库获取对应字形的SVG图形信息；根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染。2.根据权利要求1所述的方法，其中，所述字体库包括本地字体库和云端字体库；其中，所述获取所述SVG图形信息的步骤具体包括：当所述本地字体库不存在所述待加载字符中的一个或多个时，根据所述一个或多个字符的字体标识信息和编码信息从所述云端字体库获取对应字形的SVG图形信息。3.根据权利要求1所述的方法，其中，所述字体库包括云端字体库；所述云端字体库存储有多个字体集以及其中每个字体集的各字形的SVG图形信息。4.根据权利要求3所述的方法，其中，在网络设备端，该方法还包括以下步骤：获取并解析字体文件，从所述字体文件中提取各字符的编码信息、字形轮廓信息以及字形度量信息；将所述字形轮廓信息转换为对应字形的SVG图形信息并将所述字形度量信息写入所述SVG图形信息的属性中；将所述字形的SVG图形信息与其字符的编码信息关联存储至所述云端字体库的对应字体集，以建立或更新所述云端字体库。5.根据权利要求1至4中任一项所述的方法，其中，所述字符的编码信息为Unicode编码。6.根据权利要求1至5中任一项所述的方法，其中，所述字形的SVG图形信息中还包括字形度量信息。7.一种在用户设备端用于页面中字符渲染的装置，其中，该装置包括：用于获取页面中待加载字符的编码信息和文本样本信息的装置，其中，所述文本样式信息包括所述待加载字符的字体标识信息和排版信息；用于根据所述字体标识信息和所述编码信息从字体库获取对应字形的SVG图形信息的装置；用于根据所述字形的SVG图形信息和所述排版信息，在所述页面中进行字符渲染的装置。8.根据权利要求7所述的装置，其中，所述字体库包括本地字体库和云端字体库；其中，所述用于获取所述SVG图形信息的装置具体用于：当所述本地字体库不存在所述待加载字符中的一个或多个时，根据所述...

【专利技术属性】
技术研发人员：邓斌，朱一成，
申请(专利权)人：上海哔哩哔哩科技有限公司，
类型：发明
国别省市：