Amazon AWS S3 dataeksport til IoT-sensorovervågning med Tools.Valarm.net

Jeg kørte nogle revisioner på en ny webapplikation, som vi er ved at starte. Chromium foreslår i netværksudnyttelse, at et par billeder på vores websted ikke har højde / bredde-dimensioner udtrykkeligt deklareret.

Vil dette virkelig hjælpe præstation? Bortset fra at browseren ikke behøver at beslutte, hvordan billedet skal vises, og grundlæggende bliver bedt om at bruge X-højde og Y-bredde til et billede, hvordan kan dette hjælpe "netværksudnyttelse"?

Eventuelle andre kommentarer vedrørende dette ville blive værdsat!

Det hjælper kun med individuel browserydelse. Det vil ikke øge netværksudnyttelsen på nogen måde. Når browseren gengiver html, begynder den at allokere og placere objekter, og hvis den har eksplicitte instruktioner om, hvordan pladsen tildeles, analyseres layoutet, mens billedet fortsætter med at indlæses i baggrunden. Med moderne bredbånds downloadhastigheder er dette mindre og mindre et problem, men det er stadig mærkbart. Hvis du nogensinde er gået til en side med mange billeder (http://www.skysports.com/ er et eksempel), der ikke eksplicit indstiller billedstørrelser, vil du bemærke, at siden hopper og springer, når billeder indlæses i dom og browseren opdaterer grænsefladen for at kompensere for den nye størrelse. Med eksplicit billedstørrelse elimineres denne springende oplevelse. På mange CMS-steder kan billedets størrelse dog ikke være eksplicit kendt hele tiden, så denne adfærd kan være uundgåelig.

Hvis du kender billedets størrelse, gør det ikke ondt at lægge det derinde, selvom du muligvis heller ikke ser nogen "reel" gevinst ved det.

EDIT - som en anden test kan du prøve det med 2 forskellige sider ved hjælp af "lorem ipsum" -tekst, der er viklet rundt om et stort billede (4 MB eller deromkring?). Da der ikke er nogen reel måde, hvorpå billedet kan indlæses hurtigt (medmindre det cachelagres), skal du bemærke en forskel i visningsadfærd mellem de eksplicitte og ikke-eksplicitte sider.

  • Jeg tror nogen billedstørrelse kan være kendt på forhånd, fordi du kan kontrollere serversiden (f.eks. getimagesize() i PHP) inden generering af HTML.
  • @DisgruntledGoat - Det afhænger af CMS, det anvendte sprog, tilgængelige værktøjer osv. Det afhænger også af, hvor meget overhead du vil føje til et websted, bare for at slippe af med en mindre sprænghed. Det gælder heller ikke for CSS-specificerede højde / bredde-attributter.
  • @DisgruntledGoat: Hvis du tjekker med PHP bare for at sætte størrelsen i et img-mærke, bliver dit websted langsommere.
  • @webjunkie: Det er ikke et stort præstationshit, medmindre du gør det mange gange på hver side. (Og med cache, der forsvinder.) @Joel: Sandt, jeg påpegede bare, at det kan gøres i de fleste / alle CMS, ikke at antyde, at det er. Selvom jeg tror, ​​at de fleste CMS vil tilføje bredde / højde, når du tilføjer et billede til en side - som direkte attributter i koden, ikke genereret ved hver sideindlæsning.

Jeg ved ikke om faktiske præstationsgevinster, men det hjælper browserens malingstid, hvilket får applikationen til at virke hurtigere for brugeren. Undervurder ikke et hurtigere brugergrænseflade med hensyn til, hvordan din applikation opfattes.

  • Ret, den del kan jeg få, men jeg forstår ikke, hvorfor krom placerer dette forslag i kategorien netværksudnyttelse.
  • Jeg er heller ikke sikker på, hvorfor den er der. Det ser ikke ud til at være det mest nøjagtige sted.
  • @Chris: Den eneste grund, der kommer til at tænke på, er måske browsere, der bestemmer, hvilken rækkefølge de downloader billeder baseret på deres størrelse, for eksempel ved først at downloade mindre billeder, så webstedet ser mere "komplet" ud. Eller måske, hvis størrelsen på andre billeder betyder, at et billede er "under folden", downloader det først det sidste.
  • @Ulykkelig: Interessante tanker, jeg vil se nærmere på dette.

arbejdet for dig: Charles Robertson | Ønsker du at kontakte os?