https://gdekomfort.ru/resource/js/webpjs/rs.webpcheck.js

1(function() {
2    /**
3     * Успешно разрешает Promise, если браузер поддерживает формат webP,
4     * в противном случает отклоняет его
5     *
6     * @return Promise
7     */
8    function supportsWebp() {
9        return new Promise(function(resolve, reject) {
10            if (!self.createImageBitmap) {
11                reject();
12            } else {
13                var webpData = 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=';
14
15                fetch(webpData)
16                    .then(function(response) {
17                        return response.blob();
18                    })
19                    .then(function(blobData) {
20                        return createImageBitmap(blobData).then(function() {
21                            resolve();
22                        }, function() {
23                            reject();
24                        });
25                    }, function() {
26                            reject();
27                });
28            }
29        });
30    }
31
32    /**
33     * Загружает скрипт и вызывает callback, по окончании загрузки
34     *
35     * @param url
36     * @param callback
37     * @return void
38     */
39    function loadScript(url, callback)
40    {
41        // Добавляем тег сценария в head
42        var head = document.getElementsByTagName('head')[0];
43        var script = document.createElement('script');
44        script.type = 'text/javascript';
45        script.src = url;
46
47        // Затем связываем событие и функцию обратного вызова.
48        // Для поддержки большинства обозревателей используется несколько событий.
49        script.onreadystatechange = callback;
50        script.onload = callback;
51
52        // Начинаем загрузку
53        head.appendChild(script);
54    }
55
56    /**
57     * Проверяет поддержку webP и в случае необходимости начинает загрузку polyfills для webP
58     *
59     * @return void
60     */
61    function start()
62    {
63        supportsWebp().catch(function() {
64
65            var script = document.createElement('script');
66            script.src = global.folder + '/resource/js/webpjs/polyfills.js';
67            document.head.appendChild(script);
68
69            var loadWebpJS = function() {
70                document.addEventListener('DOMContentLoaded', function(){
71                    var script = document.createElement('script');
72                    script.src = global.folder + '/resource/js/webpjs/webp-init.js';
73                    script.defer = true;
74                    document.body.appendChild(script);
75                });
76            };
77            loadScript(global.folder + "/resource/js/webpjs/webp-hero.bundle.js", loadWebpJS);
78        });
79    }
80
81    /**
82     * Проверяет, поддерживаются ли Promise в браузере, если нет, то загружает
83     * сперва Polyfill для Promise и только потом запускает этап проверки webP
84     *
85     * @return void
86     */
87    function init()
88    {
89        if(/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) {
90            //Если это IE, то загружаем polyfill для Promise
91            loadScript(global.folder + "/resource/js/webpjs/bluebird.core.min.js", function() {
92                start();
93            });
94        } else {
95            start();
96        }
97    }
98
99    init(); //Запускаем процесс
100})();