一、Brotli简介

           Brotli最初发布于2015年，用于网络字体的离线压缩，brotli这个名字来自瑞士的烘培产品。Google软件工程师在2015年9月发布了包含通用无损数据压缩的Brotli增强版本，特别侧重于HTTP压缩。其中的编码器被部分改写以提高压缩比，编码器和解码器都提高了速度，流式API已被改进，增加更多压缩质量级别。新版本还展现了跨平台的性能改进，以及减少解码所需的内存。

          与常见的通用压缩算法不同，Brotli使用一个预定义的120千字节字典。该字典包含超过13000个常用单词、短语和其他子字符串，这些来自一个文本和HTML文档的大型语料库。预定义的算法可以提升较小文件的压缩密度。Brotli是基于LZ77算法的一个现代变体、霍夫曼编码和二阶上下文建模等方式进行数据压缩。一个 Brotli 压缩⽂件由 元块(meta-blocks) 集合组成。每个元块最多可容纳 16MiB，由两部分组成：一个 数据部分（data part），它存储 LZ77 压缩的放⼊块，以及一个 标题（header），每个块的压缩遵循经典的 LZ77 压缩⽅案并由计算具有良好的熵的 LZ77 解析和计算 LZ 短语的简洁编码这两个主要阶段组成。Brotli压缩数据格式的规范在RFC7932中定义，使用brotli取代deflate，gzip来对文本文件压缩通常可以增加20%的压缩密度，而压缩与解压缩速度则大致不变。与其他压缩算法相比（如zip，gzip等），无论是压缩时间，还是压缩体积上看，它都有着更高的效率使用Brotli进行流压缩的内容编码类型已被提议使用“br”。Brotli 的编码器库提供了 12 个质量级别（从 0 到 11）。它们是⽤压缩速度换取压缩效率的压缩模式：更⾼质量的级别速度较慢，但会产⽣更好的压缩⽐。

       简言之，Brotli是开源的一种新型压缩算法，Brotli压缩比Gzip压缩性能更好。开启Brotli压缩功能后，CDN节点会对资源进行智能压缩后返回，缩小传输文件大小，提升文件传输效率，减少带宽消耗。

  • 当源站文件的大小在1 KB-10 MB时，您可以使用智能压缩或Brotli压缩来压缩文件（即1 KB以下、10 MB以上大小的文件不做压缩）。
  • Brotli压缩支持的文件类型有text/xml、text/plain、text/css、application/javascript、application/x-javascript、application/rss+xml、text/javascript、image/tiff、image/svg+xml、application/json、application/xml。
  • 服务端响应携带响应头Content-Encoding: br：服务端响应的内容是经过Brotli压缩后的资源。
  • 客户端请求携带请求头Accept-Encoding: br：客户端希望获取对应资源时进行Brotli压缩。
  • github地址：
     https://github.com/google/ngx_brotli#brotli_ratio
     https://github.com/google/brotli

二、Brotli的发展情况

2.1、浏览器端支持情况，

目前国内外的主流的浏览器都已经支持br压缩，比较早期的浏览器版本就不支持，像IE这些。

通过配置brotli压缩来提高http请求的压缩率，降低出口带宽，提升访问速度_brotli

编辑

支持情况查看： "brotli" | Can I use... Support tables for HTML5, CSS3, etc

网站支持地址检测： GZIP Compression Test | GiftOfSpeed

2.2、服务端支持情况

服务端

支持

描述

nginx

ngx_brotli

通过brotli模块实现： https://github.com/google/brotli.git

 https://github.com/google/ngx_brotli.git

apache

mod_brotli

文档说明： mod_brotli - Apache 模块

java

commons-compress

通过 Commons Compress – Overview

node.js

express-static-gzip

可以通过 express-static-gzip - npm

2.3、CDN及公有云支持情况

厂商

国内

 阿里云

 火山云

 华为云

天翼云

网宿

腾讯云

国外

 cloudflare

aws

azure

谷歌云

其他

 AMD cpu支持

2.4、手机端的支持情况

类型

浏览器

chrome

safari

uc

华为浏览器

qq浏览器

百度浏览器

微信浏览器

主流APP

目前大部份app的都基于系统的浏览器内核进行调用，目前主流的手机端浏览器均已支持。而少部分app是基于自己开发的浏览器，这部分的支持情况暂不清晰。

而针对app开发这一块可以参考：

 Brotli压缩、Brotli优势、压缩效率、Android接入Brotli、BrotliInterceptor拦截器-CSDN博客

 Android项目网络请求支持Brotli压缩记录_brotli 二阶文本-CSDN博客

2.5、主流网站的支持情况

网站

国内

百度

淘宝

京东

汽车之家

今日头条

知乎

CSDN

微信

bilibili

三、性能及测试数据

3.1、网上搜集的性能数据

通过配置brotli压缩来提高http请求的压缩率，降低出口带宽，提升访问速度_brotli_02

编辑

更详细的一些测试性能数据参考地址： Squash Compression Benchmark

3.2、实际压测的性能数据

【1】html类型测试：

类型

压缩机级别

源文件

压缩后

平均请求时间

压缩比【压缩后数据大小/源数据大小】

gzip

1

1084k

154k

38ms

14.206%

gzip

5

1084k

132k

46ms

12.177%

gzip

9

1084k

127k

51ms

11.715%

brotli

1

1084k

174k

33ms

16.051%

brotli

5

1084k

97.5k

43ms

8.994%

brotli

6

1084k

96k

52ms

8.856%

brotli

9

1084k

90.9k

90ms

8.385%

brotli

11

1084k

82.8k

2.52s

6.202%

注：html 的gzip 9级别转brotli 6级别，可以节省24.41%左右的带宽。

【2】js类型测试:

类型

压缩机级别

源文件

压缩后

平均请求时间

压缩比【压缩后数据大小/源数据大小】

gzip

9

1188k

354k

105ms

29.797%

brotli

5

1188k

331k

103ms

27.861%

brotli

6

1188k

326k

115ms

27.441%

brotli

9

1188k

320k

162ms

26.936%

注：js gzip 9级别转brotli 6级别，可以节省7.90%左右的带宽。

【3】css类型测试:

类型

压缩机级别

源文件

压缩后

平均请求时间

压缩比【压缩后数据大小/源数据大小】

gzip

9

352k

51.1k

41ms

14.517%

brotli

5

352

47.3k

31ms

13.437%

brotli

6

352k

45.8k

33ms

13.011%

brotli

9

352k

43.6k

50ms

12.386%

注：gzip 9级别转brotli 6级别，可以节省10.371%左右的带宽。

www页面元素构成流量比例：

类型

流量占比

html

87%

js

9%

css

1%

图片

2.9%

其他

0.1%

其他content-type类型由于在www机页面中的占比不超过0.01%，未对其进行测试。

四、brotli的配置及使用说明

5.1、安装

第一步：

git clone  https://github.com/google/ngx_brotli.git

cd ngx_brotli/deps

rm -rf brotli

git clone  https://github.com/google/brotli.git

cd ngx_brotli

git submodule update --init

第二步：

nginx 编译安装是加上参数：--add-module=../ngx_brotli/

注：代码地址： https://github.com/google/ngx_brotli#brotli_ratio

 https://github.com/google/brotli

5.2、配置

在nginx.conf的gzip配置之前贴上该段配置。

brotli on;

brotli_comp_level 5;

brotli_buffers 16 8k;

brotli_min_length 20;

brotli_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript image/svg+xml image/tiff;