Проверьте плз мой код, что бы вы посоветовали как его улулчшить?
 

Вечер добрый в хату...

Камрады, люблю кодить, но чувствую, что что-то не то. Люблю ваниль. И на ней стараюсь писать.

Проблема: у меня в коде часто фигурирует !== u

let u = undefined;

И вот пример кода:

// if screen resolution is higher then 1023px 
    if (xxx.matches) {
      // change site title position if mobile 
      stdb.appendChild(st);
      // if social icons do not exist 
     [B] if (sil !== u) {[/B]
        sibd.appendChild(sil);
      }
      mll.className = 'header-meta-block__list';
      mldb.appendChild(mll);
      // if header red menu exist
      [B]if (hbn !== u) {
        dhmp.appendChild(hbn);
        // if header red menu do not exist
      } else {
        return;
      }[/B]
      // if screen resolution is higher then 1023px   
    } else {
      stmb.appendChild(st);
      // if mobile navigation content exist if desktop
      if (mno.style.display === 'block') {
        document.body.style.overflow = 'hidden';
        mnb.style.position = 'fixed';
      }
     [B] if ((sibm !== u) || (sil !== u)) {[/B]
        sibm.appendChild(sil);
      }
      mll.className += ' meta--show';
      mlmp.appendChild(mll);
      // if desktop, change red menu position
     [B] if (hbn !== u) {[/B]
        hbn.className = 'mobile-navigation-show';
        mhmp.appendChild(hbn);
      }
    }
  }
  // screen resolution function 
  let xxx = window.matchMedia('( min-width: 1023px )');
  changeHeaderElements(xxx);
  xxx.addListener(changeHeaderElements);

Как этот код можно улучшить? Как бы вы решили вопрос с частым уточнением в коде, что такой-то элемент !== undefined ??

https://www.webcomponents.org/libraries
https://ru.reactjs.org/

SuperZen
Нахрен реакт, если юзать то Vue.)

Wass13
Это как раз та вещь которую решают ui-фреймворки.
Ты либо пишешь лапшу на ваниле, либо пилишь свой велосипед который выродится в тот же фреймворк, только забагованный и неподдерживаемый, либо таки используешь какой-то готовый фреймворк.

Wass13,
Это всё на CSS делается, чел.

А несуществующий элемент принято считать за null, а не undefined:

alert(document.querySelector('x'));

Vue подкупает - оптимизация спрятана под капот и т.д. но есть, наверное, свои какие-то проблемы, вот хотелось бы аналог react-virtualized и какой-нибудь нормальный враппер для OpenStreetMap... смотрел последний раз полгода назад ) но ничего не нашел...

SuperZen, по первому: отдельно - хз, что-то должно быть, а так для крупняка у нас quasar фреймоврк юзается, там эта хрень встроенная.
По второму: leaflet и leaflet-vue соответственно, хотя хз насколько это нормально по твоим меркам.)