Raym0NT

const swiper = new Swiper('.swiper-container', {
  // параметры слайдера
  pagination: {
    el: '.swiper-pagination',
    clickable: true,
    renderCustom: function (swiper, current, total) {
      let paginationHtml = "";
      const maxVisible = 3; // максимальное количество видимых элементов
      
      // добавляем первый элемент
      paginationHtml += '<span class="swiper-pagination-bullet">' + 1 + '</span>';
      
      // добавляем обрезанные числа, если их нужно показать
      if (total > maxVisible) {
        const start = current - 1;
        const end = current + 1;
        if (current < 2) {
          end += 2 - current;
        } else if (current > total - 2) {
          start -= current - (total - 3);
        }
        if (start > 1) {
          paginationHtml += '<span class="swiper-pagination-bullet">..</span>';
        }
        for (let i = start; i <= end; i++) {
          if (i > 1 && i < total) {
            paginationHtml += '<span class="swiper-pagination-bullet">' + i + '</span>';
          }
        }
        if (end < total) {
          paginationHtml += '<span class="swiper-pagination-bullet">..</span>';
        }
      } else {
        // добавляем остальные элементы
        for (let i = 2; i <= total - 1; i++) {
          paginationHtml += '<span class="swiper-pagination-bullet">' + i + '</span>';
        }
      }
      
      // добавляем последний элемент
      paginationHtml += '<span class="swiper-pagination-bullet">' + total + '</span>';
      
      return paginationHtml;
    }
  }
});

ol {
  display: grid;
  grid-template-columns: repeat(3, 50px);
  grid-template-rows: repeat(3, 50px);
  grid-auto-flow: column;
}

.text {
  mix-blend-mode: screen;
  color: #fff;
}

.background {
  background-image: url(...);
}

<div class="background">
  <h1 class="text">Transparent Text</h1>
</div>

Собственно сам вопрос в заголовке: Когда можно/нужно использовать плагины?

1) Я случайно заметил миллионы постов, о том, что следует отказаться от jQuery в пользу оптимизации.

Но так же я заметил, что очень многие используют кучу плагинов в своих проектах, избегая jQuery. В чем логика тогда?
(Например, вместо того чтобы написать какой-нибудь слайдер самому, подключают плагин по типу Swiper, и не используют и четверти возможностей)

мне нужен не сам ответ

function findOutlier(integers) {
  const [ p0, p1, p2 ] = integers.slice(0, 3).map(n => n & 1);
  return p0 === p1
    ? integers.find(n => (n & 1) !== p0)
    : integers[+(p0 === p2)];
}

const findOutlier = arr => arr
  .reduce((acc, n) => (acc[n & 1].push(n), acc), [ [], [] ])
  .find(n => n.length === 1)
  .pop();

const findOutlier = arr => arr
  .sort((a, b) => (a & 1) - (b & 1))
  .at(-((arr[0] & 1) === (arr[1] & 1)));

.hero {
  &__title {}

  @media (min-width: 1000px) {
    color: red;
    &__title {}
  }
}

div {
                position: relative;
                width: 200px;
                height: 60px;
                margin: 30px;
                border-radius: 30px;
                background: #fff;
                text-align: center;
            }

            div::before {
                content: "";
                position: absolute;
                top: -2px;
                bottom: -2px;
                left: -2px;
                right: -2px;
                background: linear-gradient(35deg, #af02e8, #0058ff);
                border-radius: 34px;
                z-index: -1;
            }
            input{
                width: 200px;
                height: 60px;
                border-radius: 30px;
                border: 0px;
                outline:none;

            }