JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//chillrain.com/js/webptest.js"></script>
<div id="webp-test-image">
</div>

JavaScript

var container = document.getElementById('webp-test-image');
XWebp.test(function() {
  container.innerHTML = '<b>Your browser support webp</b><br><img src="//chillrain.com/image/mcdonald.webp">';
}, function() {
  container.innerHTML = '<b>Your browser do not support webp use jpg instead.</b><br><img src="//chillrain.com/image/mcdonald.jpg">';
});