Duża ilość danych do JavaScript

Witam,
Jestem programistą-samoukiem, nigdy dotąd nie korzystałem z forów tego typu.
Buduję "zestawienie" wysyłane do użytkowników na maila, które musi być możliwe do otworzenia w trybie offline, działać płynnie i zawiera dużą ilość danych. Nie chcę generować 200 tabeli i wyświetlać tylko te akurat wywołane przez użytkownika, skrypt generujący tabele dynamicznie mam już przygotowany. Mój problem dotyczy jak najbardziej optymalnego przechowywania danych w takim pliku. Myślałem o tablicy JavaScript, podczas generowania tabeli odpowiednie dane byłyby z nich odczytywane. Ta struktura będzie generowana przez PHP.

Proszę o pomoc, w jaki sposób przechowywać te dane, abym w wygodny sposób mógł odczytywać dowolne dane. np. oddział 3, rok 2014, 18 kwietnia.

Struktura danych:
dane[oddział1]
[2016]
[1]
[1] (wartość1, wartość2, wartość3, wartość4) //dzień 1
[2] (wartość1, wartość2, wartość3, wartość4) //dzień 2
[3] (wartość1, wartość2, wartość3, wartość4) //dzień 3
//aż do 31 dnia miesiąca
[2] //2 = luty i dane dla wszystkich dni
[2015] //dane dla poprzedniego roku
dane[oddział2] //kolejne oddziały

Rozumiem, że chcesz "na sztywno" wbić te dane do pliku JS?

Zamiast tablic polecam obiekt i wtedy taką strukturę:

var data = {
  2016: {
    1: {
      1: [w1, w2...],
      2: [w1, w2...]
    },
       ....
    2: {},
    .... 
    12: {}
  2017: {}
};

Polecam coś wybrać i poczytać.

Jak juz musisz trzymać "bazę" w jednym pliku, to trzymaj ją w formie podobnej do tabeli bazy danych - w płaskiej strukturze, bez rozbijania dat na lata, dni, miesiące - nic tym nie zyskasz, a utrudnisz sobie robotę - daty zapisuj po prostu w formacie uniksowym:

{
    "1451606400": [
        "some data",
        "some data",
        "some data"
    ],
    "1451692800": [
        "some data",
        "some data"
    ]
}

Ewentualnie żeby nie wczytywać wszystkiego na raz możesz sobie generować wiele plików json (np. osobny plik dla kazdeo miesiąca) i pobierać je lokalnie ajaxem w razie potrzeby.

Bardzo dziękuję za pomoc, to rozwiązanie powinno sprawdzić się idealnie.
Mam jeszcze jedno.
W praktyce jedno generowanie tabel html będzie odwoływało się do ~220 danych z obiektu JS.
Mam 8 rzeczy niezbędnych i 6 kolejnych, które wyliczam z tych pierwszych ośmiu.
Takie operacje lepiej przeliczać na poziomie PHP i zwracać po 14 elementów dla każdego dnia, czy wykonywać je po stronie JS podczas samego budowania konkretnej tabeli ?
Wyliczyłem, że przesyłając jedynie 8 wartości dla każdego dnia zaoszczędzę ~40% wielkości. W skali danych z kilku lat ma to nie małe znaczenie. Ponadto PHP musiałby z góry wyliczyć wszystkie informacje kiedy to JS będzie liczył wyłącznie dla danych, które właśnie mają zostać zaczytane. Maszyna na której postawiony jest serwer php jest wystarczająco mocny, żeby się tym zajmować.

Chyba za dużo opisowo a za mało konkretów, więc co lepsze:

• 40% więcej informacji, brak obliczeń JS, wszystkie obliczenia po stronie PHP
• 40% mniej informacji, obliczenia wykonywane tylko po stronie JS dla danych aktualnie potrzebnych, brak obciążenia PHP

O ile dobrze zrozumiałem, chodzi ci o proste obliczenia arytmetyczne na elementach tablicy, tu masz test - zobacz o jakich śmiesznych liczbach mówisz:

var testData = generateTestData();

// test szybkości (przeliczenie danych dla całego miesiąca):

console.time('Czas');
for (var i = 0; i < testData.length; i++) {
    testData[i].push(testData[i][0] + testData[i][1] / testData[i][2]);
    testData[i].push(testData[i][3] * testData[i][4] - testData[i][5]);
    testData[i].push(testData[i][6] - testData[i][7] * testData[i][0]);
    testData[i].push(testData[i][3] + testData[i][4] - testData[i][5]);
    testData[i].push(testData[i][5] * testData[i][2] / testData[i][2]);
    testData[i].push(testData[i][2] / testData[i][4] / testData[i][3]);
    testData[i].push(testData[i][0] * testData[i][1] * testData[i][2]);
}
console.timeEnd('Czas');

// tablica wynikowa:

console.log(testData);

// funkcje pomocnicze:

function generateTestData() {
    var result = [], i, j;
    for (i = 0; i < 7 * 31; i++) {
        j = 8;
        result[i] = [];
        while (j--) {
            result[i].push(getRandomInt(100, 1000));
        }
    }
    return result;
}

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

U mnie w Chrome: <4ms