tokmaganbet1

Для начала давайте определимся, какую задачу нужно решить. Либо получить максимальную оценку в PageSpeed / GtMetrix, либо ускорить первую загрузку страницы для пользователей. Поверьте, это разные вещи.

Для первой цели просто выполняйте все возможные рекомендации инструмента проверки. Большинство из них фронтендеры решают средствами систем сборки (gulp, grunt, webpack). Т.е. из исходных dev-файлов собирается production-проект со всеми минификациями и оптимизациями. Можно обойтись и без них, используя онлайн-сервисы.

Далее напишу о том, что действительно влияет на скорость загрузки для конечного пользователя в порядке уменьшения значимости:

• огромные изображения

  Не нужно грузить изображение в 1Мб, если на странице будет картинка 200x200. Для этого подготовливаются миниатюры нужных размеров.
  Для уменьшения объема проводят оптимизацию (optipng, tinyjpg) и используют srcset.
  
  
• блокирующий js

  Браузер перед рендером разбирает полученный html-код. При этом проверяется синтаксис js-скриптов на валидность, и пока он не пройдет - страница не готова для показа. Поэтому необязательные скрипты нужно загружать асинхронно. Почитайте это и это.
  
  
• не используется lazy-load

  Представьте, что есть лонгрид с 1000 изображений, картой и кучей видео. Если все это браузер должен показать пользователю при первой загрузке страницы, представляете как долго она будет грузиться? Решение простое - использовать отложенную загрузку элементов, которые не попадают в текущую область видимости. Например так. Для jquery полно нужных плагинов. Вам обязательно нужно это сделать для яндекс-карты и большинства изображений.
  Вот удачный пример.
  
  
• кол-во параллельных запросов с одного домена

  Например для chrome это 6 запросов, т.е. 7-й начнет выполняться только тогда, когда вернется ответ от одного из шести первых...
  Здесь пользуются рядом приемов: спрайты для изображений (всякие стрелочки, иконки меню, почему они у вас все разными файлами?), объединение всего js-кода в один файл, css-кода в один файл, а также разносят внешние данные по поддоменам, например images.example.com для изображений, static.example.com для всей статики и т.п.
  
  
• генерация динамики на сервере

  Это относится к высоконагруженным проектам. Например когда для формирования страницы нужно брать много данных из базы, что-то с ними делать на ходу, потом идти на какой-нибудь сервис за данными и т.д. Очевидно, что генерация страницы будет долгой, причем для каждого пользователя. Решение - использовать промежуточные кеши, профилировать серверный код и т.д.
  
  

Есть и ряд других оптимизаций, которые мало влияют на реальную скорость загрузки для пользователей, но влияют на показатель оценки в PageSpeed / GtMetrix. Например это минификация js / css / html. Или перенос всяких inline-стилей в таблицы стилей.

Важно думать не только о первом показе страницы, но и о повторных. Нет смысла заново отдавать ему то, что браузер может кешировать. Поэтому статику отдаем с правильными заголовками (expires, etag) и в сжатом виде (gzip). Делается это средствами вебсервера. С этим у вас все в порядке.

Подробнее про клиентскую оптимизацию тут. О чем-то я намеренно умолчал, но сервисы все это учитывают и дают свои рекомендации. Следуйте им, и да пребудет с вами Сила.

display: flex контейнеру, детям нужный order

Кусок кода, который в этом виноват:

$(document).mouseup(function (e) { 
    var popup = $('#free_moto_lesson');
    if (e.target!=popup[0]&&popup.has(e.target).length === 0){
        $('.overlay').fadeOut();
        $(popup).fadeOut();
    }
    return false;
});

А конкретно - return false.

.map [class*="ymaps-2"][class*="-ground-pane"] {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  /* Firefox 3.5+ */
  -webkit-filter: grayscale(100%);
  /* Chrome 19+ & Safari 6+ */
}

где .map это контейнер, в котором лежит карта

https://gist.github.com/delphinpro/50f2c7b4589502b...

function triplets(str) {
    // \u202f — неразрывный узкий пробел
    return str.toString().replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1\u202f');
}

Как-то вот так: jsbin.com/qicapibame/edit?js,output

Нужно инициализировать слайдер, получить его с помощью jQuery метода data() и обновлять его методом update() ionSlider'а. Дока

linear-gradient or svg

1) https://jsfiddle.net/prLsb04f/8/ - linear-gradient
2) https://jsfiddle.net/8u94vdgo/25/ -pseudo element
3)https://jsfiddle.net/712x3s40/11/ svg element

let count = $(".my-block").length;
console.log(count);

Лучше чем чужие исходники, вам никто не скажет как можно сделать https://github.com/search?l=CSS&q=admin&type=Repos...

В чем проблема? Контейнер вокруг textarea и input делаете, дальше этому блоку pos - rel, z1 а textarea и input pos - abs. Для textarea width 100%, height или row задаете, короче размеры, resize none, или как-то так, на память не помню, чтоб нельзя было размер поля менять, z2, а для input задаете width, height, или только ширину, сколько надо и z3, bottom +-10px, right +-10px, и для textarea задаете паддинг справа, чтоб при наборе текста он под кнопку не уходил.

мде. фрилансиры блин набигают. "ссилка". и даже сурс страницы открыть не могут. приехали.

right click - inspect element тебе в помощь. там все видно.