Best practice: 2500 x JavaScript in 1000 Unterseiten einbinden

[Troy]

Liebe Gemeinde,

zur Darstellung von Abbildungen (wie Charts und Plots) verwende ich eine JavaScript-Bibliothek.

Bislang habe ich pro Abbildung ein HTML-Inhaltselement angelegt, das vereinfacht dargestellt folgenden Inhalt hat:

Inhaltselement 1

<div id="abbildung-1"></div>
<script language="javascript" type="text/javascript">
// Code, der in das div mit der id="abbildung-1" eine Abbildung lädt
</script>

In vielen Artikeln kommen mehrere Abbildungen vor...

Inhaltselement 2

<div id="abbildung-2"></div>
<script language="javascript" type="text/javascript">
// Code, der in das div mit der id="abbildung-2" eine Abbildung lädt
</script>

Inhaltselement 3

<div id="abbildung-3"></div>
<script language="javascript" type="text/javascript">
// Code, der in das div mit der id="abbildung-3" eine Abbildung lädt
</script>

Ab einer gewissen Anzahl von Artikeln (bin aktuell bei 1000) wird es mit der Wartbarkeit des JavaScript-Codes schwierig.

Wie kann ich in Contao am besten meinen Code outsourcen, ohne dass die Performance darunter leidet?
Ist es z.B. performant, 2500 .js-Dateien in einen Ordner zu laden und die Skripte via Inserttag {{file::*}} einzubinden?
Hat jemand eine bessere Idee?

Danke!

Euer Troy