PNG don Chop Space

Did you notice your app size is needlessly large and figured your app resources specifically images are the culprit for this? If Yes, then Webp is for you….

Transcript

1. PNG don Chop Space!!!
   August 28, 2021
   

   View Slide

2. Hello!
   I am Umar Saidu Auna
   Software Engineer
   a tech community organizer.
   You can find me on twitter
   @umarauna
   2
   

   View Slide

3. Png don chop space
   Did you notice your app size is
   needlessly large and figured your
   app resources specifically images
   are the culprit for this? If Yes,
   then Webp is for you….
   3
   

   View Slide

4. View Slide

5. 5
   We freed 14.3MB
   

   View Slide

6. View Slide

7. Mai nene WebP?
   1
   What is Webp? - Hausa
   

   View Slide

8. WebP is an image file format from
   Google that provides lossy
   compression (like JPEG) as well as
   transparency (like PNG) but can
   provide better compression than
   either JPEG or PNG. Lossy WebP
   images are supported in Android 4.0
   (API level 14) and higher.
   8
   

   View Slide

9. “
   One of the best things
   about WebP images it’s
   reduces the image size
   without reducing the
   image quality.
   9
   

   View Slide

10. idi ti Webp?
    2
    Why Webp? - Yoruba
    

    View Slide

11. WebP provides consistently smaller
    file sizes than its alternatives.
    11
    

    View Slide

12. WebP lossless image files are on
    average, 26% smaller than PNGs.
    12
    

    View Slide

13. WebP lossy images are 25-34%
    smaller than comparable JPG images
    13
    

    View Slide

14. View Slide

15. the new pikin
    3
    the new child - Pidgin
    

    View Slide

16. AVIF
    The AV1 image format (AVIF) is an
    exciting new open-sourced and royalty
    free optimised image format which
    supports any image codec. An AVIF image
    offers significant file size reduction
    compared with JPEG, PNG and WebP and is
    currently supported on Google Chrome,
    Firefox and Android.
    16
    

    View Slide

17. AVIF vs JPEG and WebP
    The AVIF image format offers
    significant file size reduction for
    lossy images compared with JPEG and
    even WebP – Google's image format.
    17
    

    View Slide

18. Browsers supported
    Google Chrome
    18
    Firefox
    Microsoft Edge
    not() Safari
    

    View Slide

19. 19
    JPEG
    (311.4 KB)
    Webp
    (254.2 KB)
    Avif
    (162.6 KB)
    

    View Slide

20. Webp maka Web
    4
    Webp for web? - Igbo
    

    View Slide

21. Tools
    Squoosh - Online image
    compression and conversion
    Online-Convert.com - Online image
    conversion
    21
    

    View Slide

22. Command line tools
    https://www.npmjs.com/package/cwebp
    22
    

    View Slide

23. Node Tools
    https://github.com/imagemin/imagemin
    23
    Its Plugin
    https://github.com/imagemin/imagemin-webp
    

    View Slide

24. Sketch – UI Designers
    In Sketch, we can export any slice
    in the WebP image format.
    24
    

    View Slide

25. “
    WebP is supported in
    72% of browsers
    globally used.
    25
    

    View Slide

26. Oya show me how to do it!!!
    We go convert an image to webp
    and back to png in Android Studio 26
    

    View Slide

27. Article on medium
    https://bit.ly/webp-image
    27
    

    View Slide

28. Slide
    https://speakerdeck.com/auna/png
    -don-chop-space
    28
    

    View Slide

29. 29
    nagode
    Any questions?
    You can find me at:
    ⊹
    @umarauna
    ⊹
    github.com/umarauna
    e dupe
    Daalụ
    you do well
    thank you
    

    View Slide