alex

webpack.js.org/guides/code-splitting/

let { id, name } = ctx.request.body;
let user = {
  id,
  name
}

var arr = [1,2,3,4,5,6,7,8]
var i = 3
var j = 4

console.log(arr); // [1,2,3,4,5,6,7,8]
[arr[i], arr[j]] = [arr[j++], arr[i--]];
console.log(arr); // [1,2,5,4,5,4,7,8]

// #1
// arr[j++]
// j++  вернет 4
// arr[4] вернет 5
// [arr[i], arr[j]] = [5, arr[i--]]

// #2
// arr[i--]
// i--  вернет 3
// arr[3] вернет 4
// [arr[i], arr[j]] = [5, 4]

// #3
// arr[i]
// i вернет 2
// [arr[2], arr[j]] = [5, 4]

// #4
// arr[j]
// j вернет 5
// [arr[2], arr[5]] = [5, 4]

// #5
// выполняем деструктуризацию

// #5.1
// console.log(arr[2]); // 3
// arr[2] = 5
// console.log(arr[2]); // 5

// #5.2
// console.log(arr[5]); // 6
// arr[5] = 4
// console.log(arr[5]); // 4

// #6
// в результате деструктуризации изменили исходный массив:
// [ 1, 2, 5, 4, 5, 4, 7, 8 ]

$('input').focus(e => e.currentTarget.value = '');

actions: {
  fetchData({commit}) {
    return axios.get('apiurl').then(response => {
      commit('setData', response.data)
    })
  }
}

computed: {
  ...mapState(['data'])
},
methods: {
  ...mapActions(['fetchData'])
},
async created () {
  if (!this.data) {
    await this.fetchData();
    console.log(this.data)
  }
}

new Vue({
  router,
  components: {
    App,
    Register,
    Login
  },
  render(h) {
    return h(
      this.$route.path === '/register' ? 'Register' : this.$route.path === '/login' ? 'Login' : 'App'
    )
  }
}).mount('#app')

Для флекс-элементов flex-grow: 1

https://vk.com/dev/wall.get
возвращает список постов, которые можно отфильтровать (Array.filter() ) по кол-ву лайков. но даже там стоит ограничение, максимум 100 постов за раз.

еше как вариант можете попробовать headless-браузеры типа phantom.js и аналоги

setTimeout(_ => document.querySelector('div').innerText = 4, 20000)

function selectAll(e) {
  if (typeof e === 'string') {
    e = document.querySelectorAll(e)
  } else if (!(e instanceof NodeList)) {
    return console.log('An invalid argument')
  }
  
  return Array.prototype.slice.call(e)
}

Хотелось бы оптимизировать все классы

это называется не оптимизация, а «я нифига не понимаю че происходит»

до «оптимизации»
<div class="class_3 class_2"></div> // 1px

после «оптимизации» (которую вы ожидаете) ширина сломается, т.к. class_2 уедет вверх:
<div class="class_3 class_2"></div> // 2px

поэтому здесь ошибки нет никакой, все ок, оптимизатор ваш нормально отрабатывает.

document.getElementsByClassName('first')[0].getElementsByTagName('div')[0]

document.querySelector('.first > div')

.news-img {
  vertical-align: middle;
}

и уберите везде float: left

https://github.com/camwiegert/in-view

inView('.element').once('enter', runAnimation);

$('.main-menu__item.active').prevAll('.main-menu__item');

overflow-x scroll

document.addEventListener('DOMContentLoaded', function(){
  const qs = document.querySelectorAll.bind(document);
  
  qs('.menu-bars').forEach(el => el.addEventListener('click', () => {
    qs('nav ul').forEach(el => el.classList.toggle('showing'));
  }));
  
  qs('nav ul li').forEach(el => el.addEventListener('click', () => {
    qs('nav ul').forEach(el => el.classList.remove('showing'));
  }));
});