ⓒⓢⓢ

При skew вам надо будет обрезать углы, у крайних элементов, с помощью родителя, установив overflow (что не всегда удобно при выпадающих списках).
Есть ещё вариант залить фоном:
https://codepen.io/anon/pen/rEVjed?editors=1100

Что у вас там твориться, это только вам известно.
Но как я думаю, у вас ".tab_osnovnoe" это элемент "li" и это работает так:

jQuery('.product-tabs .tab_osnovnoe').addClass('active'); // <- тут добавляется класс
jQuery('.product-tabs li').removeClass('active'); // <- тут сразу же удаляется класс

в медиа запросах не хватает родительских селекторов
.articles .article .article_text
против медиа правила:
.article_text

Простыми словами: чем больше селекторов используется в выборке, тем выше приоритет

при наличии на сервере HTTP/2 модули из CDN могут загружаться параллельно в отличии от той же webpack-сборки

C webpack-сборкой тоже может всё загружается параллельно и без блокировки контекста.

Так какой же подход все таки является более удачным в современных реалиях?

Современные реалии - современные методы. Но будут ли оправданы эти вложения - зависит от проекта. Если у вас ресурсы разбросаны по множественным серверам - то выгода будет минимальна

1. Читаем:
touchstart, touchmove, touchend
2. На событие "touchstart" запускаем таймер на, секунду.
3. Если сработал таймер значит это "зажал".
4. Если во время работы таймера пришло событие "touchmove" или "touchend", - Удаляем таймер.
Это значит не "зажал", а что-то другое, - например, клик, скролл и т.д.

в короткие сроки перейти сможет, но написать качественный проект - однозначно нет.
У каждого ЯП есть свои нюансы работы самого ЯП, свои библиотеки (фреймворки), свои архитектурные решения. "Короткие сроки" - это конечно образное сравнение

EiEich,

В m[ i ] [ j ] второй атрибут 'j' меняется, а вот если i будет больше '0', то уже ошибка "Can not set property "0" or undefined"

естественно, вы строкой const m = [[]] создаёте массив, с объявленным нулевым элементом, в который присваивается пустой массив.
при i=1, ваш массив разложиться в такую конструкцию: undefined[0]

Можно добавить m.push(i) при каждой итерации i
Но если заранее известен размер массива (величина i), то можно массив объявить так:

m = (new Array(10)).fill([]) // заменить число 10 на нужный размер

ещё так можно
https://codepen.io/anon/pen/Jqrvzv?editors=1100

Проблема css импорта в том, что браузер заранее не знает об импорте, до тех пор, пока не загрузит и обработает файл с объявлением импорта. На это влияет и глубина импорта. page.css -> main.css -> block.css
Ждём и обрабатываем 2 ресурса, чтобы обработать block.css

На текущий момент css импорты можно заменить html линками (см. Preload, prefetch и другие теги)

Так же хорошей практикой для проекта является разделение стилей и загрузка только необходимых фрагментов для отображения текущей страницы, Критический CSS + прогрессивный CSS = ?
Для небольших проектов, условно меньше 5-10к css строк для мобильных и десктопа, разбиение стилей для экономии на рендеринге почти без выигрыша

1) Как можно данные из первой функции передать во вторую?

чтобы передать данные во второй запрос, нужно дождаться эти данные, соответственно второй запрос сделать внутри .then(...)

2) Как нужно делать запрос чтобы объединить полученные данные двух этих запросов?

Promise.all(...)

Если правильно понял вашу цепочку, то можно так:

Promise.all([
  fetch(url-1),
  fetch(url-2)
])
  .then(response => {
    // response - тут данные двух запросов
  })

у вас after обрезается границами блока, потому что у блока установлен overflow: hidden
возможно и не стоит after использовать, например, при активном табе просто убрать у него границу?
https://codepen.io/anon/pen/RmgvVR

cd /D E:\site
gulp

как пример с вложенностью
https://codepen.io/anon/pen/Ezjppv

для #container не хватает position: relative;
для поворачиваемого слоя (внутри которого картинка) не хватает transform-origin: left top;
проверял на варианте rotate\scale

https://codepen.io/anon/pen/LoVOyO?editors=1100

у вас на скрине со знаком вопрос, если присмотреться, то идёт переопределение класса "column-big" на
width: $wrapper-size / 3;

Почему так ?

потому что document.querySelectorAll(...) возвращает NodeList массив, у которого нет свойства textContent

Если нужны все абзацы на странице, то можете сделать так:

var text = [];
[...document.querySelectorAll("p")].map(v => text.push(v.textContent))
// В элементах массива text будет лежать контент всех найденных абзацев

можно фоном, например так
https://codepen.io/anon/pen/PvwyQe?editors=1100

знаю есть игра где можно писать ИИ для танка но там на яве..

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

Вам собственно для чего он? конфиг запрятан в недрах зависимостей:
node_modules/@vue/cli-service/webpack.config.js и менять его напрямую не рекомендуется, т.к. теряется версионность

- Если необходимо изменить настройки вебпака, как это делается есть тут (vue.config.js создаётся в корне проекта)
- Если для редактора, то я делаю отдельный файл с минимальным объектом конфигурации, где и прописываю всякие алиасы. Потому что, например, мой phpstorm неадекватно распознаёт конфиг от vue