ComputerBase Menü
Aktuelles

WebApp zu groß! Speicherplatz auslagern / sparen?

#basTi

#basTi

Commodore
Registriert
Aug. 2005
Beiträge
4.733
Hallo zusammen,

ich arbeite gerade an einer WebApp, welche extrem wenig Speicherplatz hat (~300kB), da sie auf einem miniatur webserver laufen muss.

Was ich benötige:
  • jQuery Core + Draggable Componente (~120kB)
  • HTML (~5kB)
  • CSS (~5kB)
  • Eigener JS Code (~5kB)
  • Bilder (1MB !)

Weiteres Problem:
Der webserver ist nicht ans Internet angebunden, sondern baut ein eigenes WLAN auf zu dem man sich connected. D.h. es können keine Dateien im Internet ausgelagert werden.

Folgende Idee habe ich derzeit um das Vorhaben doch auf grafisch ansprechendem Niveau (inkl. Bilder) umzusetzen:
Die WebApp ist auf einem normalen Server gehostet, den man als erstes über eine aktive Internetanbindung ansteuern muss (was natürlich der Nachteil dieser Methode ist).
Dieser speichert dann alle benötigten Dateien mithilfe der HTML5 Cache Manifest.
Nun müsste man sich zum miniatur Webserver per WLAN verbinden (d.h. ab hier kein Inet mehr) und über das alte Bookmark zum miniaturServer umgeleitet werden.

Ist das ganze so Umsetzbar? Oder hat jemand noch andere Ideen, da die beste Lösung immernoch die wäre, alles auf dem miniatur Webserver zu haben. Doch dazu müssten die Bilder von ~1024kB auf ~100kB runter.
 
Wie viele Bilder sind es denn und inwieweit hast du sie schon komprimiert?
Welches Format besitzen diese denn?


Beste Grüße
 
Ich habe bis jetzt alle Bilder als PNG , keine komprimierung.
Wieviele:
Iphone / Ipad startup Images & Icon Images: 6 Bilder (ca 600kB)
Design (noch nicht fertig; geschätzt): ca 20
 
Bilder auf einem externen Server auslagen und dort nur den Code verwalten? selbst, wenn du NICHT im internet bist, könntest du die Daten auf einern anderen lokalen Quelle lagern möglicherweise.
 
So wie das klingt, sind die Bilder keine Fotos sondern Hintergründe mit Farbverlauf etc. oder?
Mein Vorschlag: Canvas! Da kann man teilweise beachtliche Dinge mit anstellen und kommt am Ende auf 400byte ;)
 
Erstmal danke für die Antworten.
Mehr Speicher ist nicht drin... Das Ding hat 2mb und der grossteil ist schon durch den Webserver belegt.

Canvas ist ein guter Vorschlag aber es sind dann doch Grafiken, die mit Photoshop erstellt wurden.
Zudem müssen die startscreen Grafiken wirkliche Grafiken sein soweit ich weiß. Aber so wies aussieht muss ich auf diese verzichten, da diese doch einen Großteil wegnehmen (2x1024x748) ...
 
jpg nutzen wenn möglich. Die Dateigröße wird nur ein Bruchteil sein und bei 90% Qualität sieht man auch kaum Qualitätsverluste.
Schonmal überlegt jQuery direkt mit gzip zu speichern und nur damit auszuliefern? Dann sollte es nochmal 70% kleiner sein, heutzutage kann jeder Browser gzip.

Wir haben zwar keine Ahnung was du da auf die Beine stellen willst, aber in 300KB sollte man das schon packen können. 1MB für Bilder ist schon echt heftig.

@OsVenator: pngout komprimiert nochmal eine ganze Ecke kleiner als pngcrush. Aber gegen pngslim kommt nichts an, das nutzt alle PNG-Komprimierer gleichzeitig mit einer wahnsinnig langen Laufzeit um noch das letzte Byte zu gewinnen.
 
Zuletzt bearbeitet:
Wie funktioniert das mit jquery & gzip? Hab damit noch nie was gemacht.
Bindet man das dann auch als gzip ein?
Wär natürlich super, wenn das geht!
Kann man eigtl sonst noch das jquery kleiner bekommen? Weil ich brauch nur die selector Funktionalität und das draggable.

Ja ich weiß, dass 1mb eine Menge ist. Aber wie gesagt entfallen knapp 70% davon auf die StartUp Images. Das sind 2 bilder (portrait&landscape) für ipad mit knapp 1024x768 und einmal iphone mit 960x480 (wenn ich die maße richtig im kopf hab :) ). Mal testen ob Apple da auch mit jpg klar kommt.

Und pngslim werd ich auf jeden fall testen.
 
Zuletzt bearbeitet:
Könntest du diese 'riesen'-Bilder mal hochladen?

Ich bin mir zu 95% sicher, dass man zumindest Teile davon durch Canvas ersetzen kann. Andere Teile bestimmt durch sich wiederholende Muster. Animationen durch JS-Animationen etc. :D
 
Nochmal: die größten Bilder sind die startup Screens. Und diese kann man bestimmt net durch Canvas ersetzen.
 
Auf meiner Arbeit haben wir es auch geschafft ein FullHD PNG mit 1,2MB runterzubrechen auf 2 PNGs mit jeweils 50kb + ein paar Zeilen Canvas.
Bevor du nichts zeigst, kann ich auch nicht 'geht' oder 'geht nicht' sagen ;)
 
Ich glaub wir reden aneinander vorbei :D ...

Wenn ich eine Seite auf meinem HomeScreen von meinem iDevice ablege kann ich Bilder festlegen, welche als startup images benutzt werden. Diese müssen zwingend Bilder sein (laut apple PNG)
 
du könntest zepto.js nehmen und mal schauen ob du da noch unnötige module rauswerfen kannst, das ist ne ganze ecke kleiner als jquery.
 
Hab jez n bisl gegoogelt und finde nix in der Richtung von draggable für zepto.
 
D.h. ich brauche nurnoch die draggable komponente von jQuery und die funktioniert dann mit Zepto ?
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben

Willkommen auf ComputerBase!

Mit Werbung weiterlesen

Besuche ComputerBase wie gewohnt mit Werbung und Tracking. Die Zustimmung ist jederzeit widerrufbar.

Details im Privacy Center und in der Liste unserer Partner. Ein Widerruf ist möglich in der Datenschutzerklärung.

… oder ComputerBase Pro bestellen

Nutze ComputerBase ohne Werbebanner, Video-Ads und Werbetracking schon für 4 €/Monat oder 36 €/Jahr.

Mehr zu ComputerBase Pro

Bereits Pro-Nutzer? Hier anmelden.

Tracking: Wir und unsere 165 Partner verarbeiten personenbezogene Daten, indem wir mit auf Ihrem Gerät gespeicherten Informationen (z. B. eindeutige Kennungen in Cookies) ein Nutzungsprofil erstellen, um z. B. Anzeigen zu personalisieren. Verarbeitungszwecke: Genaue Standortdaten und Abfrage von Geräteeigenschaften zur Identifikation, Informationen auf einem Gerät speichern und/oder abrufen, Personalisierte Anzeigen und Inhalte, Anzeigen- und Inhaltsmessungen, Erkenntnisse über Zielgruppen und Produktentwicklungen.

Impressum Kontakt Datenschutz