Гугл ругается на JQuery

Добрый день!

Подскажите, пожалуйста, а то всю голову уже сломал:
сайт на MODX 2/6/5 — pl сейчас в head стоит вызов jquery
<script src="[[++assets_url]]components/themebootstrap/js/jquery.min.js"></script>
при этом гугл говорит оптимизируйте этот файл, ставлю асинхронный вызов
<script async src="[[++assets_url]]components/themebootstrap/js/jquery.min.js"></script>
гугл перестает ругаться, но съезжают строки в меню, пропадают картинки в каруселе. Подскажите что нужно сделать. Заранее благодарен.
Алексей
02 ноября 2018, 17:28
modx.pro
1 251
0

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

Баха Волков
02 ноября 2018, 18:18
0
Переместить вниз не пробовали?
    Алексей
    02 ноября 2018, 18:54
    0
    Пробовал, даже менял на вызов с гугловского сайта
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    , история такая же, минут пять работает нормально а потом опять едет шрифт, и разметка.
    Сергей
    03 ноября 2018, 00:06
    0
    Попробуйте defer, а вообще посмотрите, возможно из за асинхронной загрузки не работают другие скрипты, нужно поиграть, какому то поставить defer, а какому то async. По крайней мере у меня так всегда прокатывало.
    Или используйте как вариант minifyx
      Алексей
      03 ноября 2018, 06:59
      0
      Спасибо! minifyx стоит, пробовал async — ситуация та же, defer — не прокатывает вообще (сворачивает сайт до отображения в виде перечня ссылок). Попробую сегодня поиграть с вызовом через async другие скрипты.
      Сергей
      03 ноября 2018, 08:34
      0
      Вообще если делать через minifyx, то ругаться перестаёт вообще. И ещё заметил одну странность, когда последние несколько раз использовал компонент, получалось что первая загрузка сайта нормально, но при последующих слетают стили. Не знаю с чем связано… Просто отказался от его использования.
        Алексей
        03 ноября 2018, 10:08
        0
        во во, вот сидим и ломаем голову… сейчас попробуем вызвать как вы написали: «Попробуйте defer, а вообще посмотрите, возможно из за асинхронной загрузки не работают другие скрипты, нужно поиграть, какому то поставить defer, а какому то async.» как получится напишу.
        Олег
        03 ноября 2018, 09:41
        0
        Основные стили в head.
        После открытия body jquery, причем советуют с серверов гугла ставить ссылку, т.к. у клиентов кешируется, я все равно ставлю со своего сервера.
        В самый низ body остальные скрипты, стили js компонентов.
        И будет на вашей улице счастье)
          Алексей
          03 ноября 2018, 10:07
          0
          спасибо, js компоненты вызываются внизу страницы (footer), в head идет вызов css и jquery, пробовали и так и так работает только когда со своего сервера грузишь. пробовали опустить вниз вызов jquery — слетают стили, и дальше в меню, в body где идет карусель — в ней перестает подтягивать картинки. так что вот так…
            Олег
            03 ноября 2018, 14:39
            0
            так async отрубите, понятное дело что карусели спадают
              Алексей
              03 ноября 2018, 14:48
              0
              так нет уже. Вот так выглядит head, который работает:
              <meta charset="[[++modx_charset]]">
              <meta http-equiv="X-UA-Compatible" content="IE=edge">
              <meta name="viewport" content="width=device-width, initial-scale=1.0">
              <meta name="description" content="[[*description]]"/>
              <meta name="keywords" content="[[*seoKeywords]]" />
              <meta name="author" content="">
              <base href="[[++site_url]]" />
              <title>[[*pagetitle]]</title>
              
              <!-- You can add theme from bootswatch.com: just add it into &cssSources=``.
              For example: [[++assets_url]]components/themebootstrap/css/slate/bootstrap.min.css-->
              [[MinifyX?
              	&minifyCss=`1`
              	&registerCss=`1`
              	&cssSources=`
              		[[++assets_url]]components/themebootstrap/css/bootstrap.min.css,
              		[[++assets_url]]components/themebootstrap/css/add.css,
                              [[++assets_url]]components/themebootstrap/css/yamm.css,
                              [[++assets_url]]/components/fancybox/css/jquery.fancybox.min.css
              	`
              ]]
              
              <script src="[[++assets_url]]components/themebootstrap/js/jquery.min.js"></script>
                      
              
              <script> 
              // YAMM MENU
                 $(document).on('click', '.yamm .dropdown-menu', function(e) { e.stopPropagation()})
              </script> 
              <script>
                  $(document).ready(function() {
                      $('.level2 ul').removeClass("col-sm-3");
                      $('.level1').each(function() {
                          if(!$(this).find("ul").length)
                              $(this).addClass("col-sm-3");
                      });
                  });
                   $(document).on('click','.level2 > ul > a', function(e) {
                          e.preventDefault();
                          $(this).parent().find('div.menuhide').slideToggle();
                  });
              </script>
              
              
              <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
              <!--[if lt IE 9]>
              	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
              	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
              <![endif]-->
              а вот так footer:
              <footer>
              	<div class="row">
              		<div class="col-lg-3">
              [[pdoMenu?
              &startId=`269`
              &level=`1`
              &tplParentRow=`@INLINE <p>[[+pagetitle]]</p>`
              ]]</div>
              <div class="col-lg-3">
              [[pdoMenu?
              &startId=`280`
              &level=`1`
              &tplInner=`@INLINE [[+pagetitle]]
              `
              &tplOuter=`@INLINE <p>[[+wrapper]]</p>`
              ]]</div>
              <div class="col-lg-2">
              <a href="http://www.facebook.com/groups/334645603588832/"><img src="assets/images/pages/facebook.png" class="img-responsive"&options=`h=15&w=15&zc=C`></a>
              <a href="http://vk.com/naturecosmetic.saratov"><img src="assets/images/pages/vk_2.png" class="img-responsive"&options=`h=15&w=15&zc=C`></a>
              </div>
              
              		<div class="col-lg-4">
              &copy;2017 [[++site_name]] &ndash; OOO "Компания Элетто"
              		</div>
              	[[$metrika]]	
              	</div>
              </footer>
              
              <!-- You can add theme from bootswatch.com: just add it into &cssSources=``.
              For example: [[++assets_url]]components/themebootstrap/css/slate/bootstrap.min.css-->
              [[MinifyX?
              	
              	&minifyJs=`1`
              	&registerJs=`1`
              	&jsSources=`
              		[[++assets_url]]components/themebootstrap/js/bootstrap.min.js,
                              [[++assets_url]]/components/fancybox/js/jquery.fancybox.min.js
              	`
              ]]
              но на него ругается гугл, перепробовал уже все ничего не получается.
          Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
          10