如何在 React 專案中使用 LzString?How To Use LzString in React Project?

Molly M
May 14, 2021

如題,最近專案需求,要用到 LzString (可以壓縮及解壓縮,大部份是因為 localStorage 只有 5m 的儲存空間,故需要壓縮,在頁面載入才解開使用)

google 這個套件,找不太到 React 的 Demo Code,於是在這裡紀錄一下。

install 之後,很簡單拉 重點就是用這兩個內建的 function 進行壓縮及解壓縮

compressToBase64 / decompressFromBase64

As title,the main reason for using LzString is we need to save data in localStorage which is only 5mb memories. So,use LzString can compress the data that we can save in. And, decompress data when we need it.

follow the Super Easy Step:

npm install lz-string

then:

import LZString from "lz-string";let aaastring = "This is my compression test.";
let compressed = LZString.compressToBase64(aaastring);
console.log("Size of compressed sample is: " + compressed.length);
let destring = LZString.decompressFromBase64(compressed);
console.log("Sample is: " + destring);

完成!

done!

Lz-String document : https://pieroxy.net/blog/pages/lz-string/index.html

--

--

Molly M

Molly — Software Developer / 職稱是軟體研發工程師。 因為健忘所以用 Medium 紀錄,持續ㄉ慢慢前進(ง•̀_•́)ง ❤