Блог

Главная - Вопросы по программированию - Ресурс SVG создает неопределенное количество HTTP-запросов/вызовов

Ресурс SVG создает неопределенное количество HTTP-запросов/вызовов

#html #css #svg #css-animations

Вопрос:

В Chrome (версия 94.0.4606.81) один конкретный SVG-файл загружается неограниченно (создавая неопределенное количество HTTP — запросов). Я не могу понять, почему это происходит только в Chrome (не удалось воспроизвести это в Firefox).

Вы можете сами увидеть поведение ошибки на этом веб-сайте/шаблоне: http://www.ansonika.com/fooyes/

  1. Чтобы воспроизвести его, откройте chrome DevTools->Сеть и перейдите на указанный выше веб-сайт.
  2. Мягко обновите страницу пару раз: 3-4 раза.

Как только вы обновите его, вы заметите тысячи запросов в секунду для ресурса wave_white.svg, загруженных из кэша памяти.

CSS:

 .wave {
    width: 100%;
    background-attachment: fixed;
    position: absolute;
    width: 100%;
    /*height from the svg file*/
    height: 65px;
    top: -65px;
    left: 0;
    background: url("../img/wave_white.svg");
    z-index: 99;
    animation: waves 20s linear infinite;
}
.wave:before, .wave:after {
    content: '';
    width: 100%;
    height: 65px;
    background: url("../img/wave_white.svg");
    position: absolute;
    top: 0;
    left: 0;
}
.wave:before {
    opacity: 0.4;
    animation: waves-reverse 20s linear infinite;
}
.wave:after {
    opacity: 0.6;
    animation-delay: -5s;
    animation: waves 30s linear infinite;
}

Комментарии:

1. Чтобы сообщить об ошибках Chrome: crbug.com

2. @kaiido Я не уверен, что это ошибка chrome, может быть, это css. Я считаю, что это как-то связано со свойством анимации.

3. Это случается лишь эпизодически: это ошибка Chrome. Он не может быть воспроизведен в других браузерах: это ошибка Chrome. Он вошел в бесконечный цикл запросов от CSS: это ошибка Chrome. Пожалуйста, сообщите об этом.

4. Воспроизводимо в Chrome и Edge, а не в FireFox, так что это ошибка Chromium

5. После того, как вы сообщите об этом, пожалуйста, разместите ссылку на сообщение об ошибке здесь. На благо будущих читателей.

Метки: