Само мъртвите риби се движат по течението

Всички се възхищават на стабилността, надеждността и логичността на JavaScript. Аз също съм върл фен на този език. Както знаем, освен с адекватно поведение в разнообразни ситуации, езикът е дарен и с олимпийски NPM басейн със смислени, ефективни и подпомагащи разработката библиотеки.

Днес ще ви запозная с тези JavaScript библиотеки, без които един сериозен проект би бил невъзможен.

PenisJS

Най-накрая някой е излязъл извън зоната си комфорт и е описал на какво точно прилича === операторът. Разбира се, отговорът е ясен. Ствол на пенис.

Библиотеката определено хваща окото чрез иновативния начин, по който можем да сравним две променливи. Нека проследим предимствата на PenisJS чрез този пример:

// Традиционно, супер безсмислено сравняване на променливи
let a = "mitio";
let b = "pishtova";

if (a === b) {
	console.log("equal");
}

PenisJS разбива стереотипа и предлага нова възможност за сравнение. Такъв пробив в подхода на програмиране може да бъде сравнен единствено с откриването на електричеството. Убедете се сами:

// След като е заредена библиотеката:

// Задаваме топки
penis.setBalls("mitio");

// Задаваме главичка
penis.setHead("mitio");

// Най-накрая имаме удобството да използваме глобалните
// променливи, които PenisJS се е погрижил да зададе за нас
if (B===D) {
	console.log("equal");
}

#КОЙ би се сетил, че подходът с ползването на глобални променливи ще се окаже толкова логичен, надежден и ефективен!


Thanos JS

Този NPM пакет стана известен преди малко повече от година и предизвика истински фурор сред научните среди на софтуерното инженерство.

Възможностите на този CLI побеждават в битката с всички компресори и оптимизатори до момента. Само с една команда Thanos JS редуцира проекта ви с цели 50%! Нещо повече, премахва изцяло онези файлове, които сметне за непотребни. Изборът се случва изцяло по негово усмотрение. Повечето аматьорски компресори като YUI и UglifyJS смачкват кода, премахват шпациите и новите редове, но не си свършват работата напълно. Винаги остават огризки.

Thanos JS прави всичко по-лесно и ефективно:

thanos snap-fingers --with-glove

Elevator.js

Една библиотека, насочена към хората, за които асансьорът е като втори автомобил. Ако клиентите от вашата ниша имат турбофетиш към автоматичното бавно изкачване, съпроводено от успокояваща музичка, определено си струва да включите Elevator.js в проекта си. Ще увеличите конверсиите си с поне 33%.

Практически библиотеката прави scroll-to-top бутон, работещ като копче на асансьор в панелка – без запаметяване на етажа и включвайки скърцащ, издигащ механизъм. Нечовешко удобство за потребителското изживяване обаче е музичката, която се пуска.

window.onload = () => {
    // Задаваме песента и звука, когато
	// някой се е изкачил до върха
    const elevator = new Elevator({
		mainAudio: "/src/to/galena.mp3",
		endAudio: "/src/to/dzun.mp3",
    });
    
    // Палим
	elevator.elevate();
}

Vapor.js

Това определено е най-гъвкавата и бърза библиотека, която съм виждал. С точно 0 реда код, тя не ви задължава да следвате някакъв подход за разработка. Не налага извикването на иницииращи функции. Не дава причина да я псувате.

Какво повече можете да искате от това?

Вкарването на Vapor.js в който и да е проект също е изключително лесно:

<script src="vapor.js"></script>

В модерните браузъри дори можете да използвате Data URL:

<script src="data:application/javascript,"></script>

И ето я черешката на тортата – реално не е необходимо да зареждате какъвто и да е код:

<script></script>

Brototype

Ако ви е омръзнало от грешката undefined is not a function, тази библиотека ще ви излекува от мъките. Brototype превежда последователните проверки с оператор &&  на народен език.

Тази гняз:

let myURL;

if (
	app
    && app.config
    && app.config.environment
    && app.config.environment.buildURL
) {
    myURL = app.config.environment.buildURL("dev");
}

се превръща в тази гняз това произведение на изкуството:

let myURL;

Bro(app)
    .iDontAlways("config.environment.buildURL")
    .butWhenIdo((buildURL) => {
        myURL = buildURL("dev");
    });

Смятам, че не ви трябват повече аргументи за това, защо си струва да включите Brototype в следващия си проект.


ComcastifyJS

Кой досега не се е чудил как да си увеличи времето на зареждане на страницата? С такива гнусни вируси като instant.page, които само забързват страниците, трябва да балансираме ситуацията по някакъв начин. ComcastifyJS идва на помощ!

Това е изключително модерна библиотека, която увеличава времето за зареждане на изображенията в една страница.

// Намираме всички img тагове и ги приготвяме
comcastifyjs.letsPrepareTheseImages();

// Поправяме бързото зареждане
comcastifyjs.fixMyImagesLoadingSoFast({
    // Колко от максималния размер на
    // изображението да се заради (0 - 1)
    loadMaxPercent: 0.75,
    
    // Колко допълнително време да се добави
    // за зареждане в ms
    loadSpeed: 100,
    
    // Брой пиксели, който се зарежда при
    // всеки тик на loadSpeed интервала
    loadIncrement: 5,
});

jQuery

Това е големият гигант сред библиотеките, които изброявам. Чувствам, че е неравностойно да го включвам в този списък, тъй като бие по всички критерии останалите. Все пак, нека видим на какво е способен jQuery и защо не можем без него!

Една от най-отличителните черти за тази библиотека е символът $. Той е синоним на основната функция jQuery(), с която можем да селектираме елементи от DOM дървото. Това е нещо, което можем да правим и без jQuery, но, признайте си, не харесвате ли да си мислите за пари докато пишете код? $$$

jQuery ни дава стойностни алтернативи на множество native операции, които JS може да извършва с DOM дървото. Ето примери:

Селектиране

// Селектиране на елемент с jQuery
$(".zdr.bepce");

// Супер безсмислено селектиране без jQuery
document.querySelectorAll(".zdr.bepce");

Взимане на атрибути

// Взимане на стойността на съвсем
// случаен атрибут с jQuery
$(el).attr("data-poluchi-li");

// Иу. Защо без долар?
el.getAttribute("data-poluchi-li");

Скриване на елемент

// Кратко и ясно. С кинти.
$(el).hide();

// Бляк. По-добре да си импортна jQuery
el.style.display = "none";

Мисля, че напълно и аргументирано ви убедих, че jQuery трябва да присъства в проекта ви. Направете си кефа да пишете доларче!


cowsay

Ако въображавате потребителите си като едър рогат добитък, то най-ползотворна комуникация с тях ще проведете, ако им привлечете вниманието със себеподобни. Cowsay решава този проблем по иновативен начин – рисува крава чрез символи. Ето как се случва магията:

const cowsay = require("cowsay");

console.log(cowsay.say({
	text : "хайде да гласуваме за ГЕРБ",
	e : "oO",
	T : "U "
}));

Кодът горе ще покаже на конзолата това:

 ____________________________
< хайде да гласуваме за ГЕРБ >
 ----------------------------
        \   ^__^
         \  (oO)\_______
            (__)\       )\/\
             U  ||----w |
                ||     ||

Заключение

Мързи ме да пиша заключение. Затова просто ще ви похваля NS1. Супер бърз хостинг и готин съпорт. Хоствам 4 тежки сайта на машина с неголеми ресурси там. Моят блог също е при тях. Струва си да опитате!

You’ve successfully subscribed to Dimitar K. Nikolov
Welcome back! You’ve successfully signed in.
Great! You’ve successfully signed up.
Линкът е изтекъл
Success! Check your email for magic link to sign-in.