Seite 1 von 1

Flask: Websiten-Logik in JavaScript?

Verfasst: Montag 3. Juni 2024, 15:40
von earloop
Hallo,
ich würde gerne die Webapp des folgenden Repos anpassen: https://github.com/adeept/Adeept_AWR
Die einzige html-Datei, die ich gefunden habe ist diese: https://github.com/adeept/Adeept_AWR/bl ... index.html
Aber wenn ich das richtig verstehe, wird die Logik und das Erscheinungsbild durch diese JavaScript Dateien bestimmt: https://github.com/adeept/Adeept_AWR/tr ... er/dist/js
Diese Datei https://github.com/adeept/Adeept_AWR/bl ... 5fd0a94.js besteht im Wesentlichen aus einer einzigen unglaublich langen Zeile. Ist das autogeneriert? Wer soll das denn programmiert haben und wer soll das verstehen?

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Montag 3. Juni 2024, 16:13
von __blackjack__
@earloop: Das ging offensichtlich durch einen „minifier“. Das ist nicht nur in einer Zeile, da sind auch Namen durch kurze, nichtssagende ersetzt.

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Montag 3. Juni 2024, 17:04
von earloop
Warum macht man sowas? Um zu verhindern, dass das später ein Mensch verstehen und anpassen kann?

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Montag 3. Juni 2024, 18:08
von noisefloor
Hallo,
Warum macht man sowas? Um zu verhindern, dass das später ein Mensch verstehen und anpassen kann?
Kann ein Grund sein, wobei es für "Code Obfuscation" auch spezielle Tools gibt. Der Hauptgrund, einen Minifier einzusetzen, ist den Code kürzer (=weniger Bytes) zu machen. Man man eine Webseite zehntausende oder hunderttausende Mal ausliefert, spart das a) Bandbreite und b) wird die Seite schneller geliefert.

Für Hobbyprojekte und "normal" frequentierte Seite ist das eher unerheblich, aber bei stark frequentierten Seiten kann das schon Sinn machen.

Die Entwickler haben natürlich noch den "langen", lesbaren Code, einen Minifier lässt man in der Regel erst drüber laufen, wenn der Code getestet und bereit für den Einsatz ist.

Gruß, noisefloor

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Montag 3. Juni 2024, 20:51
von Sirius3
Das minifizieren ist Teil des Build-Prozesses. Dort werden dann viele einzelne JavaScript-Module in eine Datei zusammengefasst und gleichzeitig unnötige Bytes gelöscht.
Um die Dateien trotzdem Debuggen zu können, gibt es ja auch das passende map-File, das die unminifizierte Version der Dateien und andere Informationen enthält.

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Dienstag 4. Juni 2024, 16:05
von earloop
Sirius3 hat geschrieben: Montag 3. Juni 2024, 20:51 Um die Dateien trotzdem Debuggen zu können, gibt es ja auch das passende map-File, das die unminifizierte Version der Dateien und andere Informationen enthält.
meinst Du das hier: https://github.com/adeept/Adeept_AWR/bl ... a94.js.map
das ist auch nicht viel lesbarer...

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Dienstag 4. Juni 2024, 17:50
von __blackjack__
@earloop: Wenn man die Daten da raus holt schon. Da sind ja Zeilenumbrüche in den Quelltexten, nur das die selbst als Zeichenketten in einem JSON-Dokument stehen.

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Dienstag 4. Juni 2024, 18:58
von nezzcarth
earloop hat geschrieben: Dienstag 4. Juni 2024, 16:05 meinst Du das hier: https://github.com/adeept/Adeept_AWR/bl ... a94.js.map
das ist auch nicht viel lesbarer...
Das ist auch nicht dazu gedacht, dass du das lesen kannst. Das ist als Information für Entwicklertools wie z.B. den Debugger im Browser gedacht, um die ursprüngliche Form zu rekonstruieren und dir Debugging von JavaScript unter Live-Bedingungen zu ermöglichen. Weder die Minifizierte Datei noch die Source-Map sind irgendwas, was dich beim Entwickeln groß belasten muss. Du schreibst und liest "normales" JavaScript mit Einrückungen, Zeilenvorschüben und so weiter. Die anderen Dateien sind nur für das Tooling drumherum so wie das Deployment relevant; du musst die weder schreiben noch lesen noch dich sonstwie inhaltlich damit auseinander setzen.

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Mittwoch 5. Juni 2024, 18:23
von earloop
nezzcarth hat geschrieben: Dienstag 4. Juni 2024, 18:58 Die anderen Dateien sind nur für das Tooling drumherum so wie das Deployment relevant; du musst die weder schreiben noch lesen noch dich sonstwie inhaltlich damit auseinander setzen.
Wie kann ich das Aussehen und die Funktion der Website anpassen, wenn nicht durch diese Dateien?

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Mittwoch 5. Juni 2024, 20:08
von __blackjack__
@earloop: Durch die Quelldateien aus denen das erstellt wurde. Das müsstest Du wohl den Autor fragen wo die sind/ob Du die bekommen kannst.

Re: Flask: Websiten-Logik in JavaScript?

Verfasst: Mittwoch 5. Juni 2024, 20:12
von Sirius3
@earloop: gar nicht. In der map-Datei stehen zwar die Sourcen zu den Javascript-Dateien

Code: Alles auswählen

with open('app.85fd0a94.js.map', 'rb') as file:
    data = json.load(file)

for filename, content in zip(data['sources'], data['sourcesContent']):
    if filename.startswith('webpack:///src') or filename.endswith('.js'):
        path = pathlib.Path(filename[11:])
        path.parent.mkdir(exist_ok=True, parents=True)
        path.writetext(content)
für die Styles (außerhalb der vue-Dateien) gilt das aber nicht, da gibt es kein map-file.
Ebenso fehlen die ganzen Dateien, die zum Bauen nötig sind. Läßt sich zwar mit ein wenig Mühe alles rekonstruieren, wenn man sich aber mit webpack und vue nicht auskennt, ist das einiges an Einarbeitung.
Wie viel Aufwand Du treiben willst, mußt Du selbst wissen. Einfacher wäre es wohl, beim Author der Datein nachzufragen, ob er auch die Sourcen bereitstellen kann,