Seenthis
•
 
Identifiants personnels
  • [mot de passe oublié ?]

Blog - JakeArchibald.com

https://jakearchibald.com

  • ►/2020
    • ►/avif-has-landed
  • ►/2017
    • ►/combining-fonts
  • ►/static
    • ►/imgs
      • ►/icon.e36785a43208.png
  • ►/2016
    • ►/caching-best-practices
      • ►/#the-service-worker-the-http-cache-play-well-together-dont-make-them-fight
    • ►/performance-benefits-of-rel-noopener
    • ►/link-in-body
    • ►/streams-ftw
  • ►/2014
    • ►/offline-cookbook
  • @arno
    ARNO* @arno ART LIBRE 17/09/2020
    3
    @spip
    @marcimat
    @realet
    3

    Pour ce qui nous intéresse (si si), la grosse nouveauté d’iOS 14, c’est qu’il accepte désormais les images WebP.

    J’ai testé avec mes sites où la version WebP est générée directement par mon #plugin #SPIP image_responsive, ça bascule sur les versions WebP de manière totalement transparente.

    De ma propre expérience :

    – sur les fichiers JPEG, je gagne généralement autour de 30% à 50% sur le poids des images. Avec des dessins au trait, je gagne systématiquement 50%.

    – sur des fichiers PNG (quand j’ai besoin de la transparence), c’est absolument énorme, les images sont 7 à 8 fois plus légères.

    Sur un site comme La Méthode Curie, où j’utilise énormément d’images au trait avec transparence, la différence est donc phénoménale :
    ▻https://lamethodecurie.fr/index.html

    ARNO* @arno ART LIBRE
    • @fil
      Fil @fil 17/09/2020

      apparemment encore plus fort que webp : AVIF
      ▻https://reachlightspeed.com/blog/using-the-new-high-performance-avif-image-format-on-the-web-today

      Fil @fil
    • @marcimat
      marcimat @marcimat 18/09/2020

      Ça a l’air top Avif aussi effectivement.

      marcimat @marcimat
    • @b_b
      b_b @b_b PUBLIC DOMAIN 18/09/2020

      Un autre article à propos du format #AVIF avec des comparaisons assez bluffantes ▻https://jakearchibald.com/2020/avif-has-landed

      b_b @b_b PUBLIC DOMAIN
    • @_cym_
      _cym_ @_cym_ 18/09/2020

      très agréable, le site sur le labo de Marie...

      _cym_ @_cym_
    Écrire un commentaire
  • @olange
    Olivier Lange @olange CC BY-SA 29/01/2020
    1
    @fil
    1

    « 2016 – the year of web streams » by Jake Archibald, 25.01.2016
    ►https://jakearchibald.com/2016/streams-ftw

    #webstreams #javascript

    What is the underlying data-structure transporting content? It is Uint8Array.

    Olivier Lange @olange CC BY-SA
    Écrire un commentaire
  • @baroug
    baroug @baroug 7/06/2017

    Combining fonts - JakeArchibald.com
    ▻https://jakearchibald.com/2017/combining-fonts

    https://jakearchibald.com/static/imgs/icon.e36785a43208.png

    The trick is in the unicode-range descriptor. It indicates that the src should only be used for the hyphen (U+2d) and equals (U+3d) code points. You can turn a unicode character into a code point using this snippet:

    #typo #web_design #font-face

    baroug @baroug
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 28/12/2016

    Caching best practices & max-age gotchas
    ▻https://jakearchibald.com/2016/caching-best-practices/#the-service-worker-the-http-cache-play-well-together-dont-make-them-

    “you can hack around poor caching in your service worker, but you’re way better off fixing the root of the problem. Getting your caching right makes things easier in service worker land, but also benefits browsers that don’t support service worker”

    #webperf_cache_ServiceWorker_clevermarks

    • #caching
    Nicolas Hoizey @nhoizey CC BY-NC-SA
    Écrire un commentaire
  • @ccoveille
    ccoVeille @ccoveille 27/07/2016

    The performance benefits of rel=noopener for HTML a tag (and the security reminder)
    ▻https://jakearchibald.com/2016/performance-benefits-of-rel-noopener

    Posted 21 July 2016 If you have links to another origin, you should use rel="noopener", especially if they open in a new tab/window.

    Example site

    Without this, the new page can access your window object via window.opener. Thankfully the origin security model of the web prevents it reading your page, but no-thankfully some legacy APIs mean it can navigate your page to a different URL using window.opener.location = newURL. Web superhero Mathias Bynens wrote about this in detail, but I just discovered there’s a performance benefit too. Demo

    The random numbers act like a heartbeat for this page. If random numbers aren’t being generated every frame, something is holding up the thread. Now click one of these to open a page that runs some expensive JavaScript:

    Without (...)

    ccoVeille @ccoveille
    Écrire un commentaire
  • @ze_dach
    ze_dach @ze_dach CC BY-NC-SA 17/02/2016

    The future of loading CSS - JakeArchibald.com
    ▻https://jakearchibald.com/2016/link-in-body

    Chrome is intending to change the behaviour of <link rel="stylesheet">, which will be noticeable when it appears within <body>. The impact and benefits of this aren’t clear from the blink-dev post, so I wanted to go into detail here.

    #CSS #HTML #Link #Body #Chrome #dev

    ze_dach @ze_dach CC BY-NC-SA
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 25/01/2016

    2016 - the year of web streams - JakeArchibald.com
    ►https://jakearchibald.com/2016/streams-ftw

    Streaming is one of the browser’s biggest assets, and 2016 is the year it’s unlocked to #JavaScript. Tags: #stream JavaScript #webperf #clevermarks

    Nicolas Hoizey @nhoizey CC BY-NC-SA
    Écrire un commentaire
  • @robin
    robin @robin CC BY 3/11/2015

    The offline cookbook - JakeArchibald.com
    ▻https://jakearchibald.com/2014/offline-cookbook

    With ServiceWorker (intro) we gave up trying to solve offline, and gave developers the moving parts to go solve it themselves. It gives you control over caching and how requests are handled. That means you get to create your own patterns. Let’s take a look at a few possible patterns in isolation, but in practice you’ll likely use many of them in tandem depending on URL & context.

    robin @robin CC BY
    Écrire un commentaire