2022 Web Almanac - Laporan kondisi web saat ini

 (almanac.httparchive.org)
11 poin oleh xguru 2022-10-03 | 1 komentar | Bagikan ke WhatsApp
  • Laporan berskala besar yang diterbitkan setiap tahun
  • Metrik yang dibuat dengan memproses 8.36M situs web dan 43.88TB data
  • Tahun ini terdiri dari 22 bab dalam total 4 bagian
    • Page Content : CSS, JavaScript, Markup, Structured Data, Fonts, Media, WebAssembly, Third Parties, Interoperability
    • User Experience : SEO, Accessibility, Performance, Privacy, Security, Mobile Web, Capabilities, PWA
    • Content Publishing : CMS, Jamstack, Sustainability
    • Content Distribution : Page Weight, HTTP

Hal-hal menarik (fun facts) yang dirangkum oleh @stefanjudis

CSS

  • File CSS halaman desktop terbesar berukuran 62MB, sedangkan CSS untuk halaman mobile 78MB
  • Situs yang memuat file CSS paling banyak adalah situs mobile yang memuat 1387 file
  • Nama class yang paling banyak digunakan adalah active(47%), fa(33%), wp-*(31%), button(27%), pull-right (26%)
  • Satuan font yang paling banyak digunakan di tingkat situs adalah px(71%) em(15%) rem(6%) pt(2%)
  • Format warna yang paling banyak digunakan adalah #rrggbb(49%) , #rgb(25%), rgba(14%), transparent(8%)
  • Nama warna yang paling jarang digunakan adalah mediumspringgreen < darksalmon < mediumorchid < darkorchid
  • Hanya 0.3% halaman yang menggunakan accent-color
  • Fitur media query yang paling banyak digunakan adalah max-width(83%) min-width(79%) -webkit-min-device-pixel-ratio(35%) prefers-reduced-motion(34%) orientation(30%)

JS

  • Di desktop/mobile, async(76%) defer(42%) async and defer(28%/29%) module(4%)
    • Menggunakan async dan defer bersama adalah antipola. defer selalu diabaikan dan async mendapat prioritas
  • 77% halaman mobile menyertakan skrip pemblokir render di dalam <head>
  • Library yang paling banyak digunakan: jQuery 81% > core-js 41% > jQuery Migrate 34% > jQuery UI 23% > Modernizr 13% > Lodash 9%

Media

  • Format gambar : jpg 40% > png 28.2% > gif 15.9% > webp 8.9% > svg 4.7% > ico 1.6%
  • Hanya 1 dari 10 gambar hero yang di-lazy load
  • Hanya 28% tag img yang memiliki height dan width

Bacaan terkait