JavaScript фреймворктерінің бағасы

Веб-сайтты баяулатудың ондағы JavaScript кодын пайдаланудан жылдамырақ жолы жоқ. JavaScript-ті пайдаланған кезде сіз оны жобалардың орындалуымен төрт еседен кем емес төлеуіңіз керек. Сайттың JavaScript коды пайдаланушылардың жүйелерін қалай жүктейді:

  • Файл желі арқылы жүктелуде.
  • Жүктеп алғаннан кейін қаптамадан шығарылған бастапқы кодты талдау және құрастыру.
  • JavaScript кодының орындалуы.
  • Жадты тұтыну.

Бұл комбинация шығады өте қымбат.

JavaScript фреймворктерінің бағасы

Біз жобаларымызға JS кодын көбірек енгіземіз. Ұйымдар React, Vue және басқалар сияқты фреймворктер мен кітапханалар арқылы жұмыс істейтін сайттарға қарай жылжыған сайын, біз сайттардың негізгі функционалдығын JavaScript-ке өте тәуелді етіп жасаймыз.

Мен JavaScript фреймворктерін пайдаланатын өте ауыр сайттарды көрдім. Бірақ менің бұл мәселеге көзқарасым өте біржақты. Өйткені, мен жұмыс істейтін компаниялар сайттың өнімділігі саласында күрделі мәселелерге тап болғандықтан, маған жүгінеді. Нәтижесінде мен бұл мәселенің қаншалықты жиі кездесетіні және белгілі бір сайттың негізі ретінде сол немесе басқа фреймворларды таңдаған кезде қандай «айыппұлдар» төлейтіні туралы қызықты болдым.

Жоба маған мұны түсінуге көмектесті. HTTP мұрағаты.

мәліметтер

HTTP Archive жобасы кәдімгі жұмыс үстелі сайттарына барлығы 4308655 5484239 XNUMX сілтемені және мобильді сайттарға XNUMX XNUMX XNUMX сілтемені қадағалайды. Осы сілтемелермен байланысты көптеген көрсеткіштердің арасында сәйкес сайттарда табылған технологиялар тізімі бар. Бұл әртүрлі фреймворктар мен кітапханаларды пайдаланатын мыңдаған сайттарды таңдай алатынымызды және олардың клиенттерге қанша код жіберетінін және бұл кодтың пайдаланушылар жүйелеріне қаншалықты жүктелетінін біле алатынымызды білдіреді.

Мен 2020 жылдың наурыз айындағы деректерді жинадым, бұл мен қол жеткізген ең соңғы деректер болды.

Мен барлық сайттардағы біріктірілген HTTP мұрағат деректерін React, Vue және Angular көмегімен табылған сайттардағы деректермен салыстыруды шештім, бірақ мен басқа бастапқы материалдарды да пайдалануды қарастырдым.

Оны қызықты ету үшін мен бастапқы деректер жинағына jQuery пайдаланатын сайттарды қостым. Бұл кітапхана әлі де танымал. Ол сондай-ақ React, Vue және Angular ұсынатын Single Page Application (SPA) үлгісіне қарағанда веб-әзірлеуге басқа тәсілді ұсынады.

Қызықтыратын технологияларды пайдаланатыны анықталған сайттарды білдіретін HTTP мұрағатындағы сілтемелер

Framework немесе кітапхана
Мобильді сайттарға сілтемелер
Кәдімгі сайттарға сілтемелер

айдағыштарды
4615474
3714643

жауап
489827
241023

Vue
85649
43691

бұрыштық
19423
18088

Үміт пен арман

Деректерді талдауға көшпес бұрын, мен үміттенгім келетіні туралы айтқым келеді.

Мен идеалды әлемде фреймворктар әзірлеушілердің қажеттіліктерін қанағаттандырудан асып, біздің сайттармен жұмыс істейтін қарапайым пайдаланушыға белгілі бір артықшылықтар беруі керек деп ойлаймын. Өнімділік - бұл артықшылықтардың бірі ғана. Бұл жерде қол жетімділік пен қауіпсіздік ойнайды. Бірақ бұл тек ең маңыздысы.

Сонымен, идеалды әлемде қандай да бір құрылым жоғары өнімді сайтты құруды жеңілдетуі керек. Бұл не рамка әзірлеушіге жобаны құруға лайықты негіз беретіндіктен, немесе ол дамуға шектеулер енгізетіндіктен, оған бұрылатын нәрсенің дамуын қиындататын талаптарды қойғандықтан жасалуы керек. баяу болады.

Ең жақсы жақтаулар екеуін де істеуі керек: жақсы негіз беріңіз және лайықты нәтижеге қол жеткізуге мүмкіндік беретін жұмысқа шектеулер енгізіңіз.

Деректердің медиандық мәндерін талдау бізге қажетті ақпаратты бермейді. Ал, шын мәнінде, бұл тәсіл біздің назарымыздан тыс қалады көп маңызды. Оның орнына мен қолымдағы деректерден пайыздарды алдым. Бұл 10, 25, 50 (медиана), 75, 90 процентиль.

Мені әсіресе 10 және 90-процентильдер қызықтырады. 10-шы процентиль белгілі бір құрылым үшін ең жақсы өнімділікті (немесе кем дегенде ең жақсыға көп немесе азырақ жақын) білдіреді. Басқаша айтқанда, бұл белгілі бір құрылымды пайдаланатын сайттардың тек 10% -ы оны осы немесе одан да жоғары деңгейге жеткізетінін білдіреді. 90-процентиль, керісінше, монетаның екінші жағы - бұл бізге жаман нәрселердің қаншалықты нашар болуы мүмкін екенін көрсетеді. 90-процентиль – артта келе жатқан сайттар — JS коды ең көп немесе кодты негізгі ағында өңдеуге ең ұзақ уақыт бар сайттардың төменгі 10%-ы.

JavaScript кодының көлемдері

Алдымен желі арқылы әртүрлі сайттар жіберетін JavaScript кодының өлшемін талдаудың мағынасы бар.

Мобильді құрылғыларға жіберілген JavaScript кодының көлемі (Кб).

Процентильдер
10
25
50
75
90

Барлық сайттар
93.4 
196.6 
413.5 
746.8 
1201.6 

jQuery сайттары
110.3 
219.8 
430.4 
748.6 
1162.3 

Vue сайттары
244.7 
409.3 
692.1 
1065.5 
1570.7 

Бұрыштық сайттар
445.1 
675.6 
1066.4 
1761.5 
2893.2 

Реакция сайттары
345.8 
441.6 
690.3 
1238.5 
1893.6 

JavaScript фреймворктерінің бағасы
Мобильді құрылғыларға жіберілген JavaScript кодының мөлшері

Жұмыс үстелі құрылғыларына жіберілген JavaScript кодының мөлшері (Кб).

Процентильдер
10
25
50
75
90

Барлық сайттар
105.5 
226.6 
450.4 
808.8 
1267.3 

jQuery сайттары
121.7 
242.2 
458.3 
803.4 
1235.3 

Vue сайттары
248.0 
420.1 
718.0 
1122.5 
1643.1 

Бұрыштық сайттар
468.8 
716.9 
1144.2 
1930.0 
3283.1 

Реакция сайттары
308.6 
469.0 
841.9 
1472.2 
2197.8 

JavaScript фреймворктерінің бағасы
Жұмыс үстелі құрылғыларына жіберілген JavaScript кодының мөлшері

Егер сайттар құрылғыларға жіберетін JS кодының өлшемі туралы ғана айтатын болсақ, онда бәрі сіз күткендей көрінеді. Атап айтқанда, егер фреймворктардың бірі пайдаланылса, бұл тіпті тамаша жағдайда да сайттың JavaScript кодының көлемі артады дегенді білдіреді. Бұл таңқаларлық емес - сіз JavaScript құрылымын сайттың негізіне айналдыра алмайсыз және жобаның JS кодының көлемі өте төмен болады деп күте алмайсыз.

Бұл деректердің бір қызығы, кейбір фреймворктар мен кітапханаларды басқаларға қарағанда жоба үшін жақсы бастау нүктесі деп санауға болады. jQuery бар сайттар ең жақсы көрінеді. Сайттардың жұмыс үстелі нұсқаларында олар барлық сайттарға қарағанда 15%, ал ұялы телефондарда 18% көп JavaScript қамтиды. (Расында, бұл жерде кейбір деректердің бүлінуі бар. Мәселе мынада, jQuery көптеген сайттарда бар, сондықтан мұндай сайттар басқаларға қарағанда сайттардың жалпы санымен тығыз байланысты болуы заңды. Дегенмен, бұл қаншалықты шикі екеніне әсер етпейді. деректер әрбір фреймворк үшін шығарылады.)

Код көлемінің 15-18% ұлғаюы елеулі көрсеткіш болғанымен, мұны басқа фреймворктер мен кітапханалармен салыстыра отырып, jQuery алатын «салық» өте төмен деп қорытынды жасауға болады. 10-процентильдегі бұрыштық сайттар жұмыс үстеліне барлық сайттарға қарағанда 344%, ал ұялы телефонға 377% көбірек деректерді жібереді. Реактивті сайттар келесі ең ауыр болып табылады, олар жұмыс үстеліне кодты барлық сайттарға қарағанда 193%, ал ұялы телефондарға 270% көп жібереді.

Бұған дейін мен фреймворкті пайдалану жобаға кодтың белгілі бір көлемін енгізетінін білдірсе де, онымен жұмыс істеудің басында, рамка әзірлеушіні қандай да бір түрде шектей алады деп үміттенемін. Атап айтқанда, біз кодтың максималды мөлшерін шектеу туралы айтып отырмыз.

Бір қызығы, jQuery сайттары осы идеяны ұстанады. Олар 10-процентильдегі барлық сайттардан сәл ауыр болса да (15-18%), олар 90-процентильде сәл жеңілірек, жұмыс үстелінде де, ұялы телефонда да шамамен 3%. Бұл өте маңызды артықшылық деп айтуға болмайды, бірақ jQuery сайттарында, кем дегенде, олардың ең үлкен нұсқаларында JavaScript кодтарының үлкен өлшемдері жоқ деп айтуға болады.

Бірақ басқа фреймерлер туралы бұлай айту мүмкін емес.

10-шы пайыздық жағдайдағы сияқты, Angular және React-те 90-шы пайыздық сайттар басқа сайттардан ерекшеленеді, бірақ олар, өкінішке орай, нашар жағынан ерекшеленеді.

90-процентильде бұрыштық сайттар ұялы телефонға барлық сайттарға қарағанда 141%, ал жұмыс үстеліне 159% көп деректерді жібереді. Реактивті сайттар жұмыс үстеліне барлық сайттарға қарағанда 73%, ал ұялы телефонға 58% көбірек жібереді. 90-процентильдегі React сайттарының код өлшемі 2197.8 КБ құрайды. Бұл мұндай сайттар Vue негізіндегі ең жақын бәсекелестеріне қарағанда мобильді құрылғыларға 322.9 КБ көп деректерді жіберетінін білдіреді. Angular және React негізіндегі жұмыс үстелі сайттары мен басқа сайттар арасындағы алшақтық одан да үлкен. Мысалы, жұмыс үстеліндегі React сайттары құрылғыларға Vue сайттарына қарағанда 554.7 КБ көп JS кодын жібереді.

Негізгі ағындағы JavaScript кодын өңдеуге кеткен уақыт

Жоғарыда келтірілген деректер зерттелетін фреймворктар мен кітапханаларды пайдаланатын сайттарда JavaScript кодының үлкен көлемі бар екенін анық көрсетеді. Бірақ, әрине, бұл біздің теңдеуіміздің бір бөлігі ғана.

JavaScript коды браузерге келгеннен кейін оны жұмысқа жарамды күйге келтіру керек. Әсіресе көптеген мәселелер браузердің негізгі ағынындағы кодпен орындалуы керек әрекеттерден туындайды. Негізгі ағын пайдаланушы әрекеттерін өңдеуге, стильдерді есептеуге, бет орналасуын құруға және көрсетуге жауап береді. Егер сіз негізгі ағынды JavaScript тапсырмаларымен толтырсаңыз, оның қалған тапсырмаларды уақытында орындау мүмкіндігі болмайды. Бұл беттердің жұмысында кідірістерге және «тежегіштерге» әкеледі.

HTTP Archive дерекқорында V8 қозғалтқышының негізгі ағынында JavaScript кодын өңдеуге қанша уақыт кететіні туралы ақпарат бар. Бұл дегеніміз, біз бұл деректерді жинай аламыз және негізгі ағын әртүрлі сайттардың JavaScript өңдеуіне қанша уақыт кететінін біле аламыз.

Мобильді құрылғыларда сценарийді өңдеуге қатысты процессор уақыты (миллисекундпен).

Процентильдер
10
25
50
75
90

Барлық сайттар
356.4
959.7
2372.1
5367.3
10485.8

jQuery сайттары
575.3
1147.4
2555.9
5511.0
10349.4

Vue сайттары
1130.0
2087.9
4100.4
7676.1
12849.4

Бұрыштық сайттар
1471.3
2380.1
4118.6
7450.8
13296.4

Реакция сайттары
2700.1
5090.3
9287.6
14509.6
20813.3

JavaScript фреймворктерінің бағасы
Мобильді құрылғыларда сценарийді өңдеуге қатысты процессор уақыты

Жұмыс үстелі құрылғыларында сценарийді өңдеуге қатысты процессор уақыты (миллисекундпен).

Процентильдер
10
25
50
75
90

Барлық сайттар
146.0
351.8
831.0
1739.8
3236.8

jQuery сайттары
199.6
399.2
877.5
1779.9
3215.5

Vue сайттары
350.4
650.8
1280.7
2388.5
4010.8

Бұрыштық сайттар
482.2
777.9
1365.5
2400.6
4171.8

Реакция сайттары
508.0
1045.6
2121.1
4235.1
7444.3

JavaScript фреймворктерінің бағасы
Жұмыс үстелі құрылғыларында сценарийді өңдеуге қатысты процессор уақыты

Мұнда сіз өте таныс нәрсені көре аласыз.

Жаңадан бастағандар үшін jQuery бар сайттар басқа сайттарға қарағанда негізгі ағында JavaScript өңдеуге айтарлықтай аз жұмсайды. 10-процентильде, барлық сайттармен салыстырғанда, ұялы телефондағы jQuery сайттары негізгі ағындағы JS кодын өңдеуге 61% көбірек уақыт жұмсайды. Жұмыс үстеліндегі jQuery сайттарында өңдеу уақыты 37%-ға артады. 90-процентильде jQuery сайттары жиынтық ұпайларға өте жақын ұпай жинайды. Атап айтқанда, мобильді құрылғылардағы jQuery сайттары негізгі ағында барлық сайттарға қарағанда 1.3%, ал жұмыс үстелі құрылғыларында 0.7% аз уақыт жұмсайды.

Біздің рейтингіміздің екінші жағында негізгі жіптегі ең жоғары жүктемемен сипатталатын жақтаулар бар. Бұл тағы да бұрыштық және реакция. Екеуінің арасындағы жалғыз айырмашылық, бұрыштық сайттар React сайттарына қарағанда браузерлерге көбірек код жіберсе, бұрыштық сайттар кодты өңдеу үшін процессордың аз уақытын алады. Әлдеқайда аз.

10-процентильде жұмыс үстеліндегі бұрыштық сайттар барлық сайттарға қарағанда JS кодын негізгі ағынды өңдеуге 230% көбірек уақыт жұмсайды. Мобильді сайттар үшін бұл көрсеткіш 313% құрайды. Реактивті сайттар - ең нашар орындаушылар. Жұмыс үстелінде олар кодты өңдеуге барлық сайттарға қарағанда 248%, ал ұялы телефонда 658% көп уақыт жұмсайды. 658% қате емес. 10-процентильде React сайттары кодты өңдеуге негізгі ағынның 2.7 секунд уақытын жұмсайды.

90-шы пайыздық көрсеткіш, осы үлкен сандармен салыстырғанда, кем дегенде сәл жақсырақ көрінеді. Барлық сайттармен салыстырғанда бұрыштық жобалар негізгі ағындағы жұмыс үстелі құрылғыларында 29%, ал мобильді құрылғыларда 27% көп уақыт жұмсайды. React сайттары жағдайында бірдей көрсеткіштер сәйкесінше 130% және 98% болып көрінеді.

90-процентиль үшін пайыздық ауытқулар 10-процентильге ұқсас мәндерден жақсырақ көрінеді. Бірақ бұл жерде уақытты көрсететін сандар өте қорқынышты болып көрінетінін есте ұстаған жөн. Айталық, React көмегімен жасалған веб-сайт үшін негізгі мобильді ағында 20.8 секунд. (Осы уақыт ішінде не болып жатқаны туралы әңгіме жеке мақалаға лайық деп ойлаймын).

Мұнда бір ықтимал асқыну бар (рахмет Джереми осы ерекшелікке назар аударғаным үшін және осы тұрғыдан деректерді мұқият қарастырғаным үшін). Өйткені, көптеген сайттар бірнеше алдыңғы қатарлы құралдарды пайдаланады. Атап айтқанда, мен React немесе Vue қатарында jQuery қолданатын көптеген сайттарды көрдім, өйткені бұл сайттар jQuery-ден басқа фреймворктарға немесе кітапханаларға көшіп жатыр. Нәтижесінде мен дерекқорға қайта кірдім, бұл жолы тек React, jQuery, Angular немесе Vue пайдаланатын сайттарға сәйкес келетін сілтемелерді ғана таңдадым, бірақ олардың комбинациясын емес. Міне, мен алдым.

Сайттар тек бір фреймворкты немесе тек бір кітапхананы пайдаланатын жағдайда мобильді құрылғыларда сценарийлерді өңдеуге қатысты процессор уақыты (миллисекундпен)

Процентильдер
10
25
50
75
90

Тек jQuery пайдаланатын сайттар
542.9
1062.2
2297.4
4769.7
8718.2

Тек Vue пайдаланатын сайттар
944.0
1716.3
3194.7
5959.6
9843.8

Тек бұрышты пайдаланатын сайттар
1328.9
2151.9
3695.3
6629.3
11607.7

Тек React пайдаланатын сайттар
2443.2
4620.5
10061.4
17074.3
24956.3

JavaScript фреймворктерінің бағасы
Сайттар тек бір фреймворкты немесе тек бір кітапхананы пайдаланатын жағдайда мобильді құрылғыларда сценарийлерді өңдеуге қатысты процессор уақыты

Біріншіден, таңқаларлық емес нәрсе: сайт тек бір фреймворкты немесе бір кітапхананы пайдаланған кезде, мұндай сайттың өнімділігі жиі жақсарады. Әрбір құрал 10-шы және 25-ші процентильде жақсырақ жұмыс істейді. Бұл мағынасы бар. Бір жақтау арқылы жасалған сайт екі немесе одан да көп фреймворктарды немесе кітапханаларды пайдаланып жасалған сайтқа қарағанда жақсырақ жұмыс істеуі керек.

Шын мәнінде, әрбір зерттелген алдыңғы құралдың өнімділігі бір қызық ерекшелікті қоспағанда, барлық жағдайларда жақсырақ көрінеді. Мені таң қалдырғаны 50-ші пайыздық және одан жоғары деңгейде React пайдаланатын сайттар React пайдаланатын жалғыз кітапхана болған кезде нашар жұмыс істейді. Айтпақшы, бұл деректерді осында ұсынуыма себеп болды.

Бұл аздап оғаш, бірақ мен әлі де бұл оғаштыққа түсініктеме іздеуге тырысамын.

Егер жоба React және jQuery екеуін де пайдаланса, бұл жоба jQuery-ден React-ке өтудің жарты жолында болуы мүмкін. Мүмкін, бұл кітапханалар араласқан кодтық база бар. Біз jQuery сайттары React сайттарына қарағанда негізгі ағынға аз уақыт жұмсайтынын көргендіктен, бұл jQuery-дегі кейбір функцияларды енгізу сайттың біршама жақсырақ жұмыс істеуіне көмектесетінін көрсетуі мүмкін.

Бірақ жоба jQuery-ден React-ке ауысқан сайын және React-ке көбірек сүйенетіндіктен, бәрі өзгереді. Егер сайт шынымен де сапалы болса және сайт әзірлеушілері React-ті мұқият пайдаланса, мұндай сайтпен бәрі жақсы болады. Бірақ орташа React сайты үшін React-ті кеңінен пайдалану негізгі ағынның үлкен жүктеме астында екенін білдіреді.

Мобильді және жұмыс үстелі құрылғыларының арасындағы алшақтық

Мен зерттелген деректерге қараған тағы бір көзқарас - мобильді және жұмыс үстелі құрылғыларындағы сайттармен жұмыс істеу арасындағы алшақтықтың қаншалықты үлкен екенін зерттеу. Егер JavaScript кодының көлемдерін салыстыру туралы айтатын болсақ, онда мұндай салыстыру қорқынышты ештеңені ашпайды. Әрине, жүктеп алынатын кодтың азырақ көлемін көру жақсы болар еді, бірақ мобильді және жұмыс үстелі кодтарының көлемінде айтарлықтай айырмашылық жоқ.

Бірақ егер кодты өңдеуге қажетті уақытты талдасақ, мобильді және жұмыс үстелі құрылғылары арасындағы өте үлкен алшақтық байқалады.

Жұмыс үстелімен салыстырғанда мобильді құрылғыларда сценарийлерді өңдеуге байланысты уақыттың (пайыздың) ұлғаюы

Процентильдер
10
25
50
75
90

Барлық сайттар
144.1
172.8
185.5
208.5
224.0

jQuery сайттары
188.2
187.4
191.3
209.6
221.9

Vue сайттары
222.5
220.8
220.2
221.4
220.4

Бұрыштық сайттар
205.1
206.0
201.6
210.4
218.7

Реакция сайттары
431.5
386.8
337.9
242.6
179.6

Телефон мен ноутбук арасындағы кодты өңдеу жылдамдығында қандай да бір айырмашылық күтілсе де, мұндай үлкен сандар қазіргі заманғы құрылымдардың қуаты аз құрылғыларға жеткілікті түрде бағытталмағанын және олар тапқан олқылықты жабуға тырысатынын айтады. Тіпті 10-процентильде болса да, React сайттары жұмыс үстеліндегі негізгі ағынға қарағанда мобильді негізгі ағында 431.5% көбірек уақыт жұмсайды. jQuery-де ең аз алшақтық бар, бірақ бұл жерде де сәйкес көрсеткіш 188.2% құрайды. Веб-сайт әзірлеушілері өз жобаларын өңдеу процессордың көбірек уақытын қажет ететіндей етіп жасағанда (және бұл орын алады және ол уақыт өте нашарлайды), қуатты аз құрылғылардың иелері оны төлеуі керек.

Нәтижелері

Жақсы фреймворктар әзірлеушілерге веб-жобаларды құру үшін жақсы негіз беруі керек (қауіпсіздік, қол жетімділік, өнімділік тұрғысынан) немесе оларда осы шектеулерді бұзатын нәрсені құруды қиындататын кірістірілген шектеулер болуы керек.

Бұл веб-жобалардың өнімділігіне қатысты емес сияқты (және олардың қолжетімділік).

Айта кету керек, React немесе Angular сайттары басқаларға қарағанда кодты дайындауға процессордың көп уақытын жұмсайтындықтан, React сайттары жұмыс істеп тұрған кезде Vue сайттарына қарағанда процессорды көп қажет етеді дегенді білдірмейді. Шындығында, біз қарастырған деректер фреймворктар мен кітапханалардың операциялық өнімділігі туралы өте аз айтады. Олар саналы түрде немесе жоқ, бұл шеңберлер бағдарламашыларды итермелейтін даму тәсілдері туралы көбірек айтады. Біз фреймворктардың құжаттамасы туралы, олардың экожүйесі туралы, жалпы әзірлеу әдістері туралы айтып отырмыз.

Сондай-ақ, біз бұл жерде талдамаған нәрсені атап өткен жөн, атап айтқанда, сайт беттері арасында шарлау кезінде құрылғы JavaScript кодын орындауға қанша уақыт жұмсайды. SPA пайдасына дәлел, браузерге бір беттік қосымшаны жүктегеннен кейін пайдаланушы теориялық тұрғыдан сайттың беттерін жылдамырақ аша алады. Менің тәжірибем бұл шындықтан алыс екенін айтады. Бірақ бізде бұл мәселені нақтылайтын деректер жоқ.

Түсінікті нәрсе, егер сіз веб-сайтты жасау үшін негізді немесе кітапхананы қолдансаңыз, сіз жобаны бастапқыда жүктеу және оны жұмысқа дайындау тұрғысынан ымыраға келесіз. Бұл тіпті ең жағымды сценарийлерге де қатысты.

Сәйкес жағдайларда кейбір ымыраға келуге әбден болады, бірақ әзірлеушілер мұндай ымыраға саналы түрде баруы маңызды.

Бірақ бізде оптимизмге де негіз бар. Мен Chrome әзірлеушілерінің сол құралдардың жұмысын жақсартуға көмектесу мақсатында біз қарастырған кейбір алдыңғы қатарлы құралдарды әзірлеушілермен қаншалықты тығыз жұмыс істеп жатқанын көргеніме қуаныштымын.

Дегенмен, мен прагматикалық адаммын. Жаңа архитектуралар өнімділік мәселелерін шешкен сайын жасайды. Ал қателерді түзету үшін уақыт қажет. Біз күтпеу керек сияқты жаңа желілік технологиялар барлық өнімділік мәселелерін шешеді, сіз мұны біздің сүйікті фреймворктардың жаңа нұсқаларынан күтпеуіңіз керек.

Егер сіз осы мақалада талқыланған алдыңғы қатарлы құралдардың бірін пайдаланғыңыз келсе, бұл сіздің жобаңыздың өнімділігіне зиян келтірмеу үшін қосымша күш салуыңыз керек дегенді білдіреді. Жаңа құрылымды бастамас бұрын мынаны ескеру қажет:

  • Өзіңізді ақылмен сынап көріңіз. Сізге шынымен таңдалған құрылымды пайдалану керек пе? Таза JavaScript бүгінде көп нәрсеге қабілетті.
  • Таңдалған құрылымға жеңілірек балама бар ма (мысалы, Preact, Svelte немесе басқа нәрсе) сізге осы құрылымның мүмкіндіктерінің 90% бере алады?
  • Фреймворкті әлдеқашан пайдаланып жатсаңыз, жақсырақ, консервативті, стандартты опцияларды ұсынатын нәрсе бар-жоғын қарастырыңыз (мысалы, Vue орнына Nuxt.js, React орнына Next.js және т.б.).
  • Сенің не болады бюджет JavaScript өнімділігі?
  • Қалай аласыз шектеу жобаға өте қажет болғаннан гөрі көбірек JavaScript кодын енгізуді қиындату үшін әзірлеу процесі?
  • Егер сіз әзірлеуді жеңілдету үшін негізді қолдансаңыз, қарастырыңыз саған керек пе клиенттерге фреймворк кодын жіберу. Мүмкін сіз сервердегі барлық мәселелерді шеше аласыз ба?

Әдетте бұл идеялар фронт-end әзірлеу үшін нақты не таңдағаныңызға қарамастан, қарауға тұрарлық. Бірақ олар ең басынан өнімділігі жоқ жобада жұмыс істегенде өте маңызды.

Құрметті оқырмандар! Сіз идеалды JavaScript құрылымын қалай көресіз?

JavaScript фреймворктерінің бағасы

Ақпарат көзі: www.habr.com

пікір қалдыру