{"id":143,"date":"2026-05-14T12:05:29","date_gmt":"2026-05-14T12:05:29","guid":{"rendered":"https:\/\/wp.als080717od.hemsida.eu\/?p=143"},"modified":"2026-05-14T12:05:29","modified_gmt":"2026-05-14T12:05:29","slug":"m05-3-4-4-forbattra-bildprestanda","status":"publish","type":"post","link":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/2026\/05\/14\/m05-3-4-4-forbattra-bildprestanda\/","title":{"rendered":"M05.3.4.4 F\u00f6rb\u00e4ttra bildprestanda"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Skogssidan \u00e4r gjord f\u00f6r att visa hur mycket bilder kan p\u00e5verka sidans prestanda och laddtid. Innan n\u00e5gon optimering har gjorts \u00e4r bilderna totalt runt 10MB stora och sidan tar n\u00e4stan 10 sekunder innan den har laddats in helt. Detta kan man ocks\u00e5 se p\u00e5 testet nedan<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"466\" src=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/94EA903D-57A1-4D20-B929-50771AF05927-1024x466.png\" alt=\"\" class=\"wp-image-144\" srcset=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/94EA903D-57A1-4D20-B929-50771AF05927-1024x466.png 1024w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/94EA903D-57A1-4D20-B929-50771AF05927-300x136.png 300w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/94EA903D-57A1-4D20-B929-50771AF05927-768x349.png 768w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/94EA903D-57A1-4D20-B929-50771AF05927.png 1469w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"737\" height=\"234\" src=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/5EB031BF-8DE6-406D-A8F6-040486AAA699.png\" alt=\"\" class=\"wp-image-145\" style=\"aspect-ratio:3.149670273810994;width:419px;height:auto\" srcset=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/5EB031BF-8DE6-406D-A8F6-040486AAA699.png 737w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/5EB031BF-8DE6-406D-A8F6-040486AAA699-300x95.png 300w\" sizes=\"auto, (max-width: 737px) 100vw, 737px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Bilderna har ingen h\u00f6jd och bredd satt s\u00e5 hela bilden p\u00e5 6000&#215;4000 m\u00e5ste laddas in och skalas ner. Jag beh\u00f6ver d\u00e4rf\u00f6r \u00e4ndra storleken p\u00e5 bilderna s\u00e5 att de g\u00e5r snabbare att ladda.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Resultat efter optimering<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Efter att ha endast komprimerat bilderna och inte \u00e4ndrat h\u00f6jd och bredd s\u00e5 har jag totalt sparat 25% plats.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"107\" src=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/1F05B4CF-518D-4E8F-A2E9-18EEC8747AA5.png\" alt=\"\" class=\"wp-image-146\" srcset=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/1F05B4CF-518D-4E8F-A2E9-18EEC8747AA5.png 376w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/1F05B4CF-518D-4E8F-A2E9-18EEC8747AA5-300x85.png 300w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Laddtiden \u00e4r fortfarande inte som \u00f6nskad men har \u00e4nd\u00e5 g\u00e5tt fr\u00e5n 9.2s till 6.9s vilket \u00e4r en tydlig f\u00f6rb\u00e4ttring.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Nu har jag \u00e4ndrat h\u00f6jd och bredd p\u00e5 bilderna fr\u00e5n 6000&#215;4000 till 600&#215;400, detta gjorde st\u00f6rst skillnad<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"716\" height=\"209\" src=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/D5DB70BD-4104-4DC6-875C-5216892F59A1.png\" alt=\"\" class=\"wp-image-147\" srcset=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/D5DB70BD-4104-4DC6-875C-5216892F59A1.png 716w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/D5DB70BD-4104-4DC6-875C-5216892F59A1-300x88.png 300w\" sizes=\"auto, (max-width: 716px) 100vw, 716px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Nu \u00e4r laddtidden f\u00f6r bilderna endast en femtondel \u00e4n n\u00e4r jag b\u00f6rjade. Minskade med 6.3 sekunder fr\u00e5n dom komprimerade bilderna. Hela resultatet p\u00e5 sidan blev ocks\u00e5 b\u00e4ttre, fr\u00e5n 57 i betyg p\u00e5 sidan med komprimerad html till hela 82 i betyg med den med optimerade bilder + komprimerad html.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"343\" height=\"273\" src=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/487BBD0C-F76B-45D3-8ACF-912E8F840AB0.png\" alt=\"\" class=\"wp-image-148\" srcset=\"https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/487BBD0C-F76B-45D3-8ACF-912E8F840AB0.png 343w, https:\/\/wp.als080717od.hemsida.eu\/wp-content\/uploads\/2026\/05\/487BBD0C-F76B-45D3-8ACF-912E8F840AB0-300x239.png 300w\" sizes=\"auto, (max-width: 343px) 100vw, 343px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Det blev en stor skillnad eftersom bilden nu i princip \u00e4r s\u00e5 stor som den ska vara n\u00e4r den visas. Filerna \u00e4r nu ihop endast 384 KB ist\u00e4llet f\u00f6r 10 MB. Dessa tester visar att det \u00e4r viktigt att b\u00e5de komprimera men \u00e4ven ha bilderna i r\u00e4tt storlek f\u00f6r visning. Det tar v\u00e4ldigt l\u00e5ng tid att ladda in stora bilder.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Skogssidan \u00e4r gjord f\u00f6r att visa hur mycket bilder kan p\u00e5verka sidans prestanda och laddtid. Innan n\u00e5gon optimering har gjorts \u00e4r bilderna totalt runt 10MB stora och sidan tar n\u00e4stan 10 sekunder innan den har laddats in helt. Detta kan man ocks\u00e5 se p\u00e5 testet nedan Bilderna har ingen h\u00f6jd och bredd satt s\u00e5 hela [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-143","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/posts\/143","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/comments?post=143"}],"version-history":[{"count":1,"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/posts\/143\/revisions"}],"predecessor-version":[{"id":149,"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/posts\/143\/revisions\/149"}],"wp:attachment":[{"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/media?parent=143"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/categories?post=143"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wp.als080717od.hemsida.eu\/index.php\/wp-json\/wp\/v2\/tags?post=143"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}