https://cookbook.chromadb.dev/javascripts/resource-calculator.js

1(() => {
2  const BYTES_PER_FLOAT32 = 4;
3  const BYTES_PER_GIB = 1024 ** 3;
4  const VECTOR_STOPS = [10000, 100000, 1000000, 10000000];
5  const MEMORY_PROFILES = {
6    lean: 15,
7    balanced: 30,
8    heavy: 50,
9  };
10  const STORAGE_PROFILES = {
11    vector_heavy: 2,
12    typical: 3,
13    metadata_heavy: 4,
14  };
15
16  const parsePositive = (value, fallback) => {
17    const parsed = Number(value);
18    if (!Number.isFinite(parsed) || parsed <= 0) {
19      return fallback;
20    }
21    return parsed;
22  };
23
24  const formatGiB = (value) => `${value.toFixed(2)} GiB`;
25
26  const initResourceCalculator = (root) => {
27    const scope =
28      root && typeof root.querySelectorAll === "function" ? root : document;
29    const calculators = scope.querySelectorAll("[data-resource-calculator]");
30
31    calculators.forEach((calculator) => {
32      if (!(calculator instanceof HTMLElement)) {
33        return;
34      }
35      if (calculator.dataset.initialized === "true") {
36        return;
37      }
38      calculator.dataset.initialized = "true";
39
40      const vectorStopInput = calculator.querySelector(
41        '[data-input="vector_stop"]'
42      );
43      const modelDimensionInput = calculator.querySelector(
44        '[data-input="model_dimension"]'
45      );
46      const memoryProfileInput = calculator.querySelector(
47        '[data-input="memory_profile"]'
48      );
49      const storageProfileInput = calculator.querySelector(
50        '[data-input="storage_profile"]'
51      );
52
53      const vectorCountOutput = calculator.querySelector(
54        '[data-output="vector_count"]'
55      );
56      const payloadOutput = calculator.querySelector(
57        '[data-output="payload_gib"]'
58      );
59      const ramOutput = calculator.querySelector('[data-output="ram_gib"]');
60      const diskOutput = calculator.querySelector('[data-output="disk_gib"]');
61      const vcpuOutput = calculator.querySelector('[data-output="vcpu_hint"]');
62
63      if (
64        !(vectorStopInput instanceof HTMLInputElement) ||
65        !(modelDimensionInput instanceof HTMLSelectElement) ||
66        !(memoryProfileInput instanceof HTMLSelectElement) ||
67        !(storageProfileInput instanceof HTMLSelectElement) ||
68        !(vectorCountOutput instanceof HTMLElement) ||
69        !(payloadOutput instanceof HTMLElement) ||
70        !(ramOutput instanceof HTMLElement) ||
71        !(diskOutput instanceof HTMLElement) ||
72        !(vcpuOutput instanceof HTMLElement)
73      ) {
74        return;
75      }
76
77      const recalculate = () => {
78        const stopIndex = Math.min(
79          VECTOR_STOPS.length - 1,
80          Math.max(0, Math.round(Number(vectorStopInput.value) || 0))
81        );
82        const vectors = VECTOR_STOPS[stopIndex];
83        const dimensions = parsePositive(modelDimensionInput.value, 1);
84        const headroom =
85          MEMORY_PROFILES[memoryProfileInput.value] ?? MEMORY_PROFILES.balanced;
86        const diskMultiplier =
87          STORAGE_PROFILES[storageProfileInput.value] ??
88          STORAGE_PROFILES.typical;
89
90        const payloadBytes = vectors * dimensions * BYTES_PER_FLOAT32;
91        const payloadGiB = payloadBytes / BYTES_PER_GIB;
92        const estimatedRamGiB = payloadGiB * (1 + headroom / 100);
93        const estimatedDiskGiB = payloadGiB * diskMultiplier;
94        const vcpuHint = Math.max(1, Math.ceil(estimatedRamGiB / 4));
95
96        vectorCountOutput.textContent = vectors.toLocaleString("en-US");
97        payloadOutput.textContent = formatGiB(payloadGiB);
98        ramOutput.textContent = formatGiB(estimatedRamGiB);
99        diskOutput.textContent = formatGiB(estimatedDiskGiB);
100        vcpuOutput.textContent = `${vcpuHint} vCPU`;
101      };
102
103      [
104        vectorStopInput,
105        modelDimensionInput,
106        memoryProfileInput,
107        storageProfileInput,
108      ].forEach((input) => {
109        input.addEventListener("input", recalculate);
110        input.addEventListener("change", recalculate);
111      });
112
113      recalculate();
114    });
115  };
116
117  document.addEventListener("DOMContentLoaded", () => {
118    initResourceCalculator(document);
119  });
120
121  if (typeof document$ !== "undefined" && document$) {
122    document$.subscribe((root) => {
123      initResourceCalculator(root);
124    });
125  }
126})();