<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Brandon Backer</title>
    <description>The latest articles on DEV Community by Brandon Backer (@btbacker).</description>
    <link>https://dev.to/btbacker</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F415563%2F55cdf9bc-c493-4601-afbe-630337351cd5.jpeg</url>
      <title>DEV Community: Brandon Backer</title>
      <link>https://dev.to/btbacker</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/btbacker"/>
    <language>en</language>
    <item>
      <title>Will WebP Finally Start Catching On?</title>
      <dc:creator>Brandon Backer</dc:creator>
      <pubDate>Wed, 24 Jun 2020 22:36:37 +0000</pubDate>
      <link>https://dev.to/btbacker/will-webp-finally-start-catching-on-29pe</link>
      <guid>https://dev.to/btbacker/will-webp-finally-start-catching-on-29pe</guid>
      <description>&lt;h3&gt;
  
  
  The News
&lt;/h3&gt;

&lt;p&gt;Earlier this week, the last great browser bastion of resistance to supporting WebP image formatting fell, as Apple announced during their WWDC Keynote that the upcoming &lt;a href="https://developer.apple.com/documentation/safari-release-notes/safari-14-beta-release-notes"&gt;beta release of Safari 14&lt;/a&gt; would finally include support for WebP images.  &lt;/p&gt;

&lt;p&gt;The irony here is that, as I'm about to write about the virtues of WebP, it's not a supported image type on Dev.to (whether through direct upload or URL link).  I spent a fair amount of time excitedly converting some photo and video examples to WebP images for demonstration - only to realize I wouldn't even be able to use them in this post about...WebP. &lt;br&gt;
 &lt;del&gt;Cool.&lt;/del&gt;&lt;/p&gt;

&lt;p&gt;This a perfect example of the extant problem with WebP - the image format is &lt;em&gt;still&lt;/em&gt; not (yet) widely supported enough to create a sudden stampede of converts, even with its acceptance by all major browsers.&lt;/p&gt;

&lt;p&gt;Most daily users will be looking for support in the various media sharing template upload sites that exist (from Instagram to messaging keyboards to other blog hosts) and in their local OS image previewer (like macOS Catalina's Preview) - without that, there's not much reason to use WebP in daily life (unless you have your own webpage).&lt;/p&gt;

&lt;p&gt;Will Apple's reluctant acceptance of WebP support in Safari begin to shift the tide?  That remains to be seen.&lt;/p&gt;

&lt;p&gt;Some of you may have gotten to this point of the article and are now wondering what, exactly, WebP is.  The rest of the post is for you.&lt;/p&gt;




&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Bb_AZVta--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/nhyhgm2045f4x1frmdah.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Bb_AZVta--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/nhyhgm2045f4x1frmdah.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  WebP Overview
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://developers.google.com/speed/webp/"&gt;WebP&lt;/a&gt; was released 2010 and was/is developed by Google as a next generation image format.  It supports lossy and lossless compression and provides significant file size reduction in comparison to (old) standard image file types, like JPEG (25-34% smaller), PNG (45%), and GIF(&lt;a href="https://en.wikipedia.org/wiki/WebP"&gt;up to 64%&lt;/a&gt;), with no loss in image quality.&lt;/p&gt;

&lt;p&gt;There have been many successful attempts to improve upon the older generation file types, but only WebP has been adopted by most major browsers (with the notable exception of Safari, until recently).  The main benefit of smaller file sizes is faster webpage loading times.  &lt;/p&gt;

&lt;p&gt;You can play around with tools like &lt;a href="https://developers.google.com/web/tools/lighthouse"&gt;Google Lighthouse&lt;/a&gt; to see just how much faster a specific webpage could be (taking other optimizations into account as well) - and the speed increase can be significant (think multiple seconds).&lt;/p&gt;

&lt;p&gt;Google also offers some &lt;a href="https://developers.google.com/speed/webp/docs/precompiled"&gt;precompiled utilities&lt;/a&gt; if you would like to experiment with converting image files on your own machine.  If you have the &lt;code&gt;Homebrew&lt;/code&gt; terminal package installed, you can simply run &lt;code&gt;brew install webp&lt;/code&gt; to get the conversion utility and use &lt;a href="https://developers.google.com/speed/webp/docs/using"&gt;this guide&lt;/a&gt; to help with the correct notation.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;&lt;h6&gt;&lt;span&gt;Cover photo by &lt;a href="https://unsplash.com/@markusspiske?utm_source=unsplash&amp;amp;utm_medium=referral&amp;amp;utm_content=creditCopyText"&gt;Markus Spiske&lt;/a&gt; on &lt;a href="https://unsplash.com/s/photos/apple-laptop?utm_source=unsplash&amp;amp;utm_medium=referral&amp;amp;utm_content=creditCopyText"&gt;Unsplash&lt;/a&gt;&lt;/span&gt;&lt;/h6&gt;&lt;/em&gt;&lt;/p&gt;

</description>
      <category>codenewbie</category>
      <category>ios</category>
      <category>discuss</category>
      <category>news</category>
    </item>
  </channel>
</rss>
