Защо вашият екип трябва да използва NextJS, вместо да пуска собствена ReactJS рамка

Една от причините, поради които ние като разработчици обичаме ReactJS, е, че това е малка библиотека без мнение, създадена за създаване на интерактивни потребителски изживявания. Опитайте да сравните ReactJS с библиотека като Angular — React няма „един начин“ да се справи с маршрутизирането, да се справи с извличането на данни, да се справи с глобалното състояние, да се справи с SSR. Всяко ReactJS приложение е създадено по различен начин и може да използва различна комбинация от пакети с отворен код като react-router, unstated-next, redux.

Въпреки че тази свобода да създавате приложения по ваш начин е невероятно мощна, тя има и тъмна страна. Това, което съм виждал отново и отново в кариерата си като разработчик на React, е компаниите и екипите да създават своя собствена рамка, ако желаете. Те определят собствения си „най-добър начин“ за създаване на React приложения и имат самоуверен начин за изграждане на своите потребителски интерфейси, използвайки свои собствени модели и библиотеки.

Недостатъкът на този подход на „персонализирана рамка“ е, че по-често е полуизпечен. Вътрешните инструменти никога няма да имат същото ниво на документация като външните инструменти. Те няма да се подобрят със същата скорост и често ще бъдат пренебрегвани в полза на работата върху функции, обърнати към потребителите.

Алтернативата на пускането на собствена рамка е използването на съществуваща. И избраната от мен рамка е NextJS. Така че защо да изберете NextJS за вашия екип през 2021 г.?

Ето някои от причините, поради които продължавам да се връщам към NextJS.

Получавате SSR и SSG от кутията

NextJS идва с вградени мощни възможности за изобразяване от страна на сървъра (SSR) и генериране на статичен сайт (SSG). И противно на общоприетото схващане, не е необходимо да използвате изобразяване от страната на сървъра. Екипът ми не го използва в момента, но все пак имаме страхотно изживяване за потребители и разработчици, като комбинираме генериране на статичен сайт с първоначално извличане на данни в нашия _app компонент.

Едно огромно предимство на използването на NextJS пред внедряването на вашата собствена ReactJS рамка е, че можете постепенно да подобрите приложението си. Можете да започнете със SSG и да преминете към използване на SSR, когато сте готови. Сега сравнете това със стартирането на ново приложение с create-react-app днес и след това след една година, опитвайки се да го изобразите на сървъра.

Страхотен опит за разработчици

Едно от основните предимства на използването на NextJS за нашия екип е опитът на разработчиците. С NextJS прекарваме повече време в писане на функции и по-малко време в борба с инструменти за изграждане и Webpack.

Също така наистина ни харесва как NextJS структурира своите проекти в страници и как има един начин за извършване на маршрутизиране. Когато комбинирате страхотната библиотека за извличане на данни useSWR с NextJS, става още по-добре. Можем да създаваме сложни уеб приложения, без да се нуждаем много от глобалното състояние.

Включването на нови разработчици в екипа е лесно, ако имат опит с NextJS, а ако нямат, могат да прочетат страхотната документация за NextJS или страхотни онлайн уроци, за да научат NextJS. Това е огромно предимство пред „раздвижването на нашата собствена рамка“.

Лесно надграждане

Наскоро надстроихме нашите NextJS проекти по време на работа от NextJS 10 на 11. Това включва основна актуализация на Webpack от версия 4 на 5. Ако бяхме пуснали нашето собствено ReactJS приложение с нашата собствена персонализирана конфигурация на webpack, това надграждане щеше да отнеме дни и много разочарование. С NextJS надграждането отне само около час, тъй като нашият next.config.js файл е доста малък. Трябваше само да направим няколко малки настройки на нашата конфигурация и да надстроим няколко други зависимости (като next-transpile-module).

Надстройката ни даде многобройни ползи за производителността и опита на разработчиците на много ниска цена. Нещо, от което съм много развълнуван в NextJS 11, е включването на SWC за по-бързо базирано на ръжда транспилиране.

Автоматично разделяне на код

Всяка страница във вашия NextJS е разделена на код. Това означава, че докато вашето приложение расте, за да има все повече и повече страници, размерът на пакета не го прави. Разбира се, можем да постигнем нещо подобно, като използваме динамично импортиране на react-router и webpack, но с NextJS получаваме това веднага.

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

Благодарим ви, че прочетохте и подкрепихте Frontend Digest. Ако обичате да пишете съдържание като това, не забравяйте да се „свържете“ с нас и да станете сътрудник!