function webpImage($source, $quality = 100, $removeOld = false)
{
    if(strpos('http', $source) !== false) {
        //define scheme
        $scheme = CMain::IsHTTPS() ? "https" : "http"; // http
        //replace http://server with nothing
        $source = str_replace([$scheme . '://'. $_SERVER['HTTP_HOST']], [""], $source);

    }

    if(strpos('http', $source) === false) {
        $source = '/home/bitrix/www' . $source;
    }

    $dir = pathinfo($source, PATHINFO_DIRNAME);
    $name = pathinfo($source, PATHINFO_FILENAME);
    $destination = $dir . DIRECTORY_SEPARATOR . $name . '.webp';

    
    
    $info = getimagesize($source);
    $isAlpha = false;
    
    echo $info['mime'];
    if ($info['mime'] == 'image/jpeg'){
        $image = imagecreatefromjpeg($source);
        echo $source;
        var_dump($image);
    } elseif ($isAlpha = $info['mime'] == 'image/gif') {
        $image = imagecreatefromgif($source);
    } elseif ($isAlpha = $info['mime'] == 'image/png') {
        $image = imagecreatefrompng($source);
    } else {
        return $source;
    }
    if ($isAlpha) {
        imagepalettetotruecolor($image);
        imagealphablending($image, true);
        imagesavealpha($image, true);
    }

    

    imagewebp($image, $destination, $quality);
    imagedestroy($image);


    if ($removeOld)
        unlink($source);

    return $destination;
}

public function convertImage(&$content)
    {
        if (defined('ADMIN_SECTION') || defined('WIZARD_SITE_ID')) {
            return;
        }

        preg_match_all('/"(/upload/[^"]*.(jpg|jpeg|png))"/i', $content, $matches1);
        self::convertImageToWebp($content, $matches1);
        preg_match_all("/'(/upload/[^']*.(jpg|jpeg|png))'/i", $content, $matches2);
        self::convertImageToWebp($content, $matches2);
    }

    private static function convertImageToWebp(&$content, $matches) {
        if (!empty($matches[1])) {
            foreach ($matches[1] as $i => $imageUrl) {
                $root = $_SERVER['DOCUMENT_ROOT'];
                $type = $matches[2][$i];
                $newName = str_replace($type, 'webp', $imageUrl);
                if (file_exists($root . $newName)) {
                    $content = str_replace($imageUrl, $newName, $content);
                    continue;
                }
                if (!file_exists($root . $imageUrl)) {
                    continue;
                }
                $type = strtolower($type);
                switch ($type) {
                    case 'jpeg':
                    case 'jpg':
                        $img = imagecreatefromjpeg($root . $imageUrl);
                        break;
                    case 'png':
                        $img = imagecreatefrompng($root . $imageUrl);
                        imagepalettetotruecolor($img);
                        imagealphablending($img, true);
                        imagesavealpha($img, true);
                        break;
                }
                if (isset($img)) {
                    $result = imagewebp($img, $root . $newName, 75);
					
					if (!$result) {
						continue;
					}

                    $content = str_replace($imageUrl, $newName, $content);
                    imagedestroy($img);
                    unset($img);
                }
            }
        }
    }

function resizeAndConvertImageWebP(
    $width,
    $height,
    $density,
    $originalFilepath,
    $resizedFilepath) {
  $newWidth = $width * $density;
  $newHeight = $height * $density;

  $image = new Imagick($originalFilepath);
  $origImageDimens = $image->getImageGeometry();
  $origImgWidth = $origImageDimens['width'];
  $origImgHeight = $origImageDimens['height'];

  if($newWidth == 0) {
    $ratioOfHeight = $newHeight / $origImgHeight;
    $newWidth = $origImgWidth * $ratioOfHeight;
  }

  if($newHeight == 0) {
    $ratioOfWidth = $newWidth / $origImgWidth;
    $newHeight = $origImgHeight * $ratioOfWidth;
  }

  $widthRatios = $origImgWidth / $newWidth;
  $heightRatios = $origImgHeight / $newHeight;

  if($widthRatios <= $heightRatios) {
    $cropWidth = $origImgWidth;
    $cropHeight = $newWidth * $widthRatios;
  } else {
    $cropWidth = $newHeight * $heightRatios;
    $cropHeight = $origImgHeight;
  }

  $cropX = ($origImgWidth - $cropWidth) / 2;
  $cropY = ($origImgHeight - $cropHeight) / 2;

  $image->stripImage();
  $image->cropImage($cropWidth, $cropHeight, $cropX, $cropY);
  $image->resizeImage($newWidth, $newHeight, imagick::FILTER_LANCZOS, 0.9);
  $image->setImageFormat('webp');
  $image->setImageAlphaChannel(imagick::ALPHACHANNEL_ACTIVATE);
  $image->setBackgroundColor(new ImagickPixel('transparent'));
  $image->writeImage($resizedFilepath);
}

<?=(webps() && is_file($_SERVER['DOCUMENT_ROOT'] . str_replace('.jpg', '.webp', $arItem["DETAIL_PICTURE"]["SRC"])))?'style="background-image: url('.str_replace('.jpg', '.webp', $arItem["DETAIL_PICTURE"]["SRC"]).')':'style="background-image: url('.$arItem["DETAIL_PICTURE"]["SRC"].')'?>"

$webpsupport = (strpos($_SERVER['HTTP_ACCEPT'], 'image/webp') >= 0);
if($webpsupport) {
  $this->attemptToServeWebP($pathinfo, $matches, $width, $height, $density);
} else {
  $this->attemptToServeNormal($pathinfo, $matches, $width, $height, $density);
}

<picture>
  <source srcset="img/awesomeWebPImage.webp" type="image/webp">
  <source srcset="img/creakyOldJPEG.jpg" type="image/jpeg"> 
  <img src="img/creakyOldJPEG.jpg" alt="Alt Text!">
</picture>