RomanKudlatov

Мобильные браузеры в частности сафари плохо относятся к большим единицам в значении размытия и размытия тени.
Для эксперимента убери фильтр в свг и сравни производительность.
В твоем случае оптимально экспортировать в растре. Можно даже уменьшить размер думаю 32x32px(вроде все браузеры сглаживают изображения при ресайзе) поэксперементируй.
Можно как писали в комментариях в webp, но и пнг если мелкий масштаб взять небольшого размера выйдет.

О боже как я ненавижу эти скобки надеюсь нигде не накосячил

$(document).ready(function(){
   $('#search').keyup(function(){
      $('#result').html('');
      var searchField = $('#search').val();
      var expression = new RegExp(searchField,  "i");
      $.getJSON('goods.json', function(data){
        $.each(data, function(key, value){
        let i = 0;
        while(i<10)
          {
            if(value.name.search(expression) != -1 || value.location.search(expression) != -1)
            {
            $('#result').append('<li style="list-style-type: none;margin:2px;border-bottom:1px solid #333;"><a href="'+key+'" title=""><img src="'+value.img+'" height:"40" width="40">'+value.name+'</a></li>');
            i++;
            }
          }
        });
      });
   });
});

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

node.previousSibling пробовал?

А нельзя ручками к ним всем применить один класс скрыть по классу а открывать по id? Если нет, то почему?)