Update to fflate (#448)

* Update to fflate

* Update docs, bundler config

docs/recipes/optimize-storage.md

@@ -66,7 +66,7 @@ rrweb.record({
 
 ### Use packFn to compress every event
 
-rrweb provides a pako-based simple compress function rrweb.pack.
+rrweb provides an fflate-based simple compress function rrweb.pack.
 
 You can use it by passing it as the `packFn` in the recording.
 

docs/recipes/optimize-storage.zh_CN.md

@@ -66,7 +66,7 @@ rrweb.record({
 
 ### 基于 packFn 的单数据压缩
 
-rrweb 内包含了基于 pako 的简单压缩 rrweb.pack，在录制时可以作为 `packFn` 传入。
+rrweb 内包含了基于 fflate 的简单压缩 rrweb.pack，在录制时可以作为 `packFn` 传入。
 
 ```js
 rrweb.record({

package.json

@@ -60,8 +60,8 @@
   "dependencies": {
     "@types/css-font-loading-module": "0.0.4",
     "@xstate/fsm": "^1.4.0",
+    "fflate": "^0.4.4",
     "mitt": "^1.1.3",
-    "pako": "^1.0.11",
     "rrweb-snapshot": "^1.0.1"
   }
 }

rollup.config.js

@@ -1,5 +1,4 @@
 import typescript from 'rollup-plugin-typescript';
-import commonjs from 'rollup-plugin-commonjs';
 import resolve from 'rollup-plugin-node-resolve';
 import { terser } from 'rollup-plugin-terser';
 import postcss from 'rollup-plugin-postcss';
@@ -37,12 +36,6 @@ function toMinPath(path) {
   return path.replace(/\.js$/, '.min.js');
 }
 
-const namedExports = {
-  'pako/dist/pako_deflate': ['deflate'],
-  'pako/dist/pako_inflate': ['inflate'],
-  pako: ['deflate'],
-};
-
 const baseConfigs = [
   // record only
   {
@@ -85,7 +78,7 @@ const baseConfigs = [
 let configs = [];
 
 for (const c of baseConfigs) {
-  const basePlugins = [resolve(), commonjs({ namedExports }), typescript()];
+  const basePlugins = [resolve({ browser: true }), typescript()];
   const plugins = basePlugins.concat(
     postcss({
       extract: false,
@@ -153,10 +146,7 @@ if (process.env.BROWSER_ONLY) {
   configs = {
     input: './src/index.ts',
     plugins: [
-      resolve(),
-      commonjs({
-        namedExports,
-      }),
+      resolve({ browser: true }),
       typescript(),
       postcss({
         extract: true,

src/packer/pack.ts

@@ -1,10 +1,10 @@
-import { deflate } from 'pako/dist/pako_deflate';
+import { strFromU8, strToU8, zlibSync } from 'fflate';
 import { PackFn, MARK, eventWithTimeAndPacker } from './base';
 
 export const pack: PackFn = (event) => {
   const _e: eventWithTimeAndPacker = {
     ...event,
     v: MARK,
   };
-  return deflate(JSON.stringify(_e), { to: 'string' });
+  return strFromU8(zlibSync(strToU8(JSON.stringify(_e))), true);
 };

src/packer/unpack.ts

@@ -1,4 +1,4 @@
-import { inflate } from 'pako/dist/pako_inflate';
+import { strFromU8, strToU8, unzlibSync } from 'fflate';
 import { UnpackFn, eventWithTimeAndPacker, MARK } from './base';
 import { eventWithTime } from '../types';
 
@@ -16,7 +16,7 @@ export const unpack: UnpackFn = (raw: string) => {
   }
   try {
     const e: eventWithTimeAndPacker = JSON.parse(
-      inflate(raw, { to: 'string' }),
+      strFromU8(unzlibSync(strToU8(raw, true)))
     );
     if (e.v === MARK) {
       return e;

yarn.lock

@@ -1079,6 +1079,11 @@ fd-slicer@~1.1.0:
   dependencies:
     pend "~1.2.0"
 
+fflate@^0.4.4:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/fflate/-/fflate-0.4.4.tgz#b23c3f53a687bbce62a091af98f621ca7f68a191"
+  integrity sha512-BBKysCIvETp1l5wTUvjCR+tfFmlvSWtzNZe3SkQN1xDeTD9dscGypw5NZEZIkyPazKGOnpaKFlMwOmuTgApiJQ==
+
 figures@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/figures/-/figures-2.0.0.tgz#3ab1a2d2a62c8bfb431a0c94cb797a2fce27c962"
@@ -2063,11 +2068,6 @@ package-json@^4.0.0:
     registry-url "^3.0.3"
     semver "^5.1.0"
 
-pako@^1.0.11:
-  version "1.0.11"
-  resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
-  integrity sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==
-
 parse-glob@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c"