Geek asks and answers

Less CSS and local memory issues

I use LESS CSS (more precisely less.js), which seems to use LocalStorage under the hood. I have never seen such an error as this before when launching my application locally, but now I get a "Constant maximum storage size reached" on each page display, just above the link is a unique .less file of my application.

This only happens with Firefox 12.0.

Is there any way to solve this?

PS: basically, inspired by the calculation of localStorage space usage , this is what I ended up with (this is based on Prototype and depends on the custom trivial Logger class, but this should be easily adapted in your context):

"use strict";
var LocalStorageChecker = Class.create({
    testDummyKey: "__DUMMY_DATA_KEY__",
    maxIterations: 100,
    logger: new Logger("LocalStorageChecker"),
    analyzeStorage: function() {
        var result = false;
        if (Modernizr.localstorage && this._isLimitReached()) {  
            this._clear();
        }
        return result;
    },
    _isLimitReached: function() {
        var localStorage = window.localStorage;
        var count = 0;
        var limitIsReached = false;
        do {
            try {
                var previousEntry = localStorage.getItem(this.testDummyKey);
                var entry = (previousEntry == null ? "" : previousEntry) + "m";
                localStorage.setItem(this.testDummyKey, entry);
            }
            catch(e) {
                this.logger.debug("Limit exceeded after " + count + " iteration(s)");
                limitIsReached = true;
            }
        }
        while(!limitIsReached && count++ < this.maxIterations);
        localStorage.removeItem(this.testDummyKey);
        return limitIsReached;
    },
    _clear: function() {
        try {
            var localStorage = window.localStorage;
            localStorage.clear();
            this.logger.debug("Storage clear successfully performed");
        }
        catch(e) {
            this.logger.error("An error occurred during storage clear: ");
            this.logger.error(e);
        }
    }
});


document.observe("dom:loaded",function() {
    var checker = new LocalStorageChecker();
    checker.analyzeStorage();
});

P.P.S.: , X (, ).

+3
2

Less.js , @imported. script, , . script destroyLessCache ('/path/to/css/'), localStorage css , .

    function destroyLessCache(pathToCss) { // e.g. '/css/' or '/stylesheets/'
       if (!window.localStorage || !less || less.env !== 'development') {
            return;
       }
       var host = window.location.host;
       var protocol = window.location.protocol;
       var keyPrefix = protocol + '//' + host + pathToCss;
       for (var key in window.localStorage) {
          if (key.indexOf(keyPrefix) === 0) {
             delete window.localStorage[key];
          }
       }
    }
+1

More articles:


All Articles