获取localStorage的使用容量和最大容量

最新推荐文章于 2024-07-28 20:15:57 发布

Justin0223

最新推荐文章于 2024-07-28 20:15:57 发布

阅读量3.4k

点赞数 2

分类专栏： ECMAScript6

本文链接：https://blog.csdn.net/u010377383/article/details/110007440

版权

本文介绍如何在前端计算localStorage的使用体积和剩余体积，以优化本地缓存策略。内容包括理解localStorage的最大容量，并推荐了一个处理缓存过期时间的库lscache。

摘要由CSDN通过智能技术生成

（一）前言
我们最近需要涉及一套前端缓存库, 主要对一些列表数据进行本地缓存, 避免二次进入页面空白时间太长，这里内嵌webview，持久缓存就需要使用localStorage。这里主要讲述怎么计算当前使用体积和剩余体积

（二）最大容量

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>容量</title>
</head>
<body>
  <div class="total">
    总数：
  </div>
  <button class="btn2">获取总数</button>
  <hr />
 <script>
   function getTotalSize() {
     localStorage.clear();
     var test = '0123456789';
     var add = function(num) {
       num += num;
       if(num.length === 10240) {
         test = num;
         return;
       }
       add(num);
     }
     add(test);
     var sum = test;
     var timer = setInterval(function(){
       sum += test;
       try {
         localStorage.removeIt