-1

I have a JS array which each key of it contains the whole HTML of a page. I use that array as a back and forward button.

Sometimes when it contains the HTML of 100 pages, the performance of the browser will drop. Well I have two questions:

  1. Is it possible to I calculate the size of a JS array on the memory?
  2. How can I limit an array? I mean, I want to remove old array's values when I push new values. Something example blow.

Current array:

var myarr = ['val1', 'val2', 'val3']; // - it should be limited to 3 values
+------+------+------+
| val1 | val2 | val3 |
+------+------+------+

Expected array after pushing a new value into it:

myarr.push('val4'); // expected result:

+------+------+------+
| val2 | val3 | val4 |
+------+------+------+

Is doing that possible?

stack
  • 10,280
  • 19
  • 65
  • 117
  • 2
    Use [Array.prototype.shift()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/shift) for removing the first element. – Danmoreng Apr 24 '17 at 14:09
  • Use a method yourArrayInsertCustomMethod(item) to manage your array logic – ferflores Apr 24 '17 at 14:10
  • if you know how to use array.slice you can create a new array of the desired length: `var arr2 = [...myarr.slice(-2), 'var4']` – maioman Apr 24 '17 at 14:11
  • For the first question, http://stackoverflow.com/q/19354808/215552 has answers, and http://stackoverflow.com/q/1248302/215552 has how to calculate an object's memory footprint. Just loop over your array. Please read [the documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) for more information on array methods. – Heretic Monkey Apr 24 '17 at 14:11
  • Just a note: look into templating and single page apps, so you don't have to save 100 pages worth of html to begin with. – Shilly Apr 24 '17 at 14:13
  • 1
    I should also mention that loading the entire HTML of a page into memory like that is likely a Bad Idea. It completely defeats the purpose of browser's ability to cache pages. – Heretic Monkey Apr 24 '17 at 14:13
  • You can use an if statement with array.length – Aldin Juko Apr 24 '17 at 14:13
  • Possible duplicate of [Count bit/byte size of array](http://stackoverflow.com/questions/19354808/count-bit-byte-size-of-array) – Heretic Monkey Apr 24 '17 at 14:13

2 Answers2

0

Obvious you want kind of a stack. If you have this array alread in use and many calls on push for example. You could replace it's push function (not Array.prototype but the push on the instance itself). There you could limit the array and shift the element if needed.

var push = arrayInstance.push;
arrayInstance.push = function(elem) {
    // todo check length and remove leading elems if needed
    push(elem);
}

It may be not syntactically correct but you get a grasp. This is not a clean solution, a better one is to nest the functionality and create an according object/class.

sascha10000
  • 1,245
  • 1
  • 10
  • 22
0

Why even use an array. If you are dynamically constructing the values for the array that are the HTML of the PREVIOUS and NEXT pages, couldn't you simply have global variables that hold these values for you?

lastPage = HTML of currentPage-1
thisPage = HTML of currentPage
nextPage = HTML of currentPage +1

so when you move forward...

lastPage = thisPage;
thisPage = nextPage;
nextPage = HTML of currentPage + 1 (computed)

and back...

nextPage = thisPage;
thisPage = lastPage;
lastPage = HTML of currentPage -1 (computed)

That way there will not be any array growth or memory leak issues.

TJS101
  • 490
  • 1
  • 7
  • 19