Мазмұны
- 01. Бұрыштық
- 02. Реакция
- 03. Vue
- Фреймворктардың синтаксисі қалай салыстырылады?
- Танымалдық және нарық
- Мобильді қосымшаларды әзірлеу
- 2020 жылы күтілетін басқа негіздер
- Қорытынды
2020 жылы веб-дамуға көмектесетін көптеген құрылымдар мен кітапханалар бізге беріледі. Бірақ әрдайым әр түрлі бола бермейтін. 2005 жылы сценарийлердің Mocha деп аталатын жаңа тілін Брендан Эйх деген жігіт жасады. LiveScript болып өзгертілгеннен кейін бірнеше ай өткен соң, атау қайтадан JavaScript болып өзгертілді. Содан бері JavaScript ұзақ жолдан өтті.
2010 жылы біз магистральдық және бұрыштық бірінші JavaScript құрылымы ретінде енгізілгенін көрдік, ал 2016 жылға қарай барлық веб-сайттардың 92% -ы JavaScript қолданды. Бұл мақалада біз негізгі үш JavaScript құрылымын (Angular, React және Vue) және олардың келесі онжылдықтағы мәртебесін қарастырамыз. Өз сайтыңызды жасағыңыз келе ме? Веб-сайт жасаушылар тізімін көріңіз.
Кейбір керемет ресурстар үшін веб-дизайн құралдары тізімін, веб-хостинг қызметтерін және осы қолданушыларды тестілеудің тамаша бағдарламалық жасақтамасын қараңыз.
01. Бұрыштық
AngularJS 2010 жылы шығарылды, бірақ 2016 жылы ол толығымен қайта жазылды және бұрыштық 2 ретінде шығарылды. Angular - бұл Google әзірлеген, Wix, Upwork, The Guardian, HBO және басқалары қолданатын толыққанды веб-құрылым.
Артықшылықтары:
- TypeScript үшін ерекше қолдау
- MVVM әзірлеушілерге сол мәліметтер жиынтығын қолданып, бір қолданба бөлімінде жұмысты бөлуге мүмкіндік береді
- Өте жақсы құжаттама
Минус:
- Оқудың қисығы бар
- Ескі нұсқадан көшу қиынға соғуы мүмкін.
- Жаңартулар жүйелі түрде енгізіліп отырады, өйткені әзірлеушілер оларға бейімделуі керек
Келесі не?
Angular 9-де Ivy - әдепкі компилятор. Бұл өнімділік пен файлдың көлеміне қатысты көптеген мәселелерді шешуге арналған. Ол қосымшаларды кішірек, жылдам және қарапайым етуі керек.
Angular-дың алдыңғы нұсқаларын React және Vue-мен салыстырған кезде
Бұрышты пайдаланған кезде түпнұсқалық өлшемдер үлкенірек болды. Ivy сонымен қатар прогрессивті гидратацияны мүмкін етеді, бұл бұрыштық команда 2019 I / O-да көрсетті. Progressive Hydration Ivy-ді серверге және клиентке біртіндеп жүктеу үшін қолданады. Мысалы, пайдаланушы парақпен қарым-қатынас жасай бастағаннан кейін компоненттердің коды кез-келген жұмыс уақытымен бірге бөліктерге алынады.
Ivy Angular үшін үлкен назар аударатын сияқты және оны барлық қолданбаларға қол жетімді ету. 9-нұсқада бас тарту мүмкіндігі болады, бұрыштық 10-ға дейін.
02. Реакция
React бастапқыда 2013 жылы Facebook арқылы шығарылған және интерактивті веб-интерфейстер құру үшін қолданылады. Мұны Netflix, Dropbox, PayPal және Uber пайдаланады.
Артықшылықтары:
- React өнімділігіне жағымды әсер ететін виртуалды DOM пайдаланады
- JSX жазу оңай
- Жаңартулар тұрақтылықты бұзбайды
Минус:
- Басқа сәтсіздіктердің бірі - күрделі бағдарламаларды жасау үшін бөгде кітапханалар қажет
- Дамытушылар дамудың ең жақсы жолында қараңғыда қалады
Келесі не?
React Conf 2019-да React тобы бірнеше жұмыс істеді. Біріншісі - таңдамалы ылғалдандыру, мұнда реакция қолданушы әрекеттесетін компоненттерге басымдық беру үшін жұмыс істеп тұрған кез-келген уақытты тоқтатады. Пайдаланушы белгілі бір бөліммен өзара әрекеттесуге бара жатқанда, бұл аймақ ылғалдандырылады. Команда сонымен қатар Suspense-пен жұмыс істеді, ол React жүйесі, кодтар, деректер мен кескіндерді жүктеуді ұйымдастырады. Бұл компоненттерді көрсетуден бұрын бірдеңе күтуге мүмкіндік береді.
Таңдамалы ылғалдандыру және күту режимі екі қолданушының реакциясына жауап беру сияқты React бағдарламасына неғұрлым жоғары басымдыққа ие нәрсеге назар аудару үшін төменгі басымдылықтағы жұмыстың үлкен блоктарына ену мүмкіндігін беру арқылы жылдамдықты болуға мүмкіндік беретін бір уақытта қолдануға мүмкіндік береді. Сондай-ақ, команда қол жетімділікті екі тақырыпқа - фокус пен кіріс интерфейстерін басқаруға назар аудара отырып қарастырған тағы бір бағыт ретінде атады.
03. Vue
Vue-ді 2014 жылы Google-дың бұрынғы қызметкері Эван Ю жасаған болатын. Оны Xiaomi, Alibaba және GitLab пайдаланады. Vue қысқа уақыт ішінде және ірі брендтің қолдауынсыз танымал және қолдаушылардан қолдау тапты.
Артықшылықтары:
- Өлшемі өте жеңіл
- Бастауыш достық - үйрену оңай
- Ұлы қауым
Минус:
- React with Facebook және Angular with Google сияқты үлкен компанияның қолдауына ие емес
- Нақты құрылым жоқ
Келесі не?
Vue тезірек, кішірек, күтіп ұсталатын және жасаушыларға жергілікті мақсатты қоюды жеңілдететін мақсат қойды (егер сізде қиындықтар туындаса, веб-хостинг қызметін қарастырыңыз). Келесі шығарылым (3.0) 2020 жылдың бірінші тоқсанында аяқталуы керек, оған TypeScript қолдауымен бірге жақсарту үшін виртуалды DOM қайта жазуы кіреді. Сондай-ақ, құрамдаушыларға жұмыс орнына компоненттер құрудың және оларды функциялар бойынша ұйымдастырудың жаңа әдісін ұсынатын Composition API қосылды.
Vue-ді дамытушылар Suspense-пен жұмыс істейді, ол сіздің компонентіңізді көрсетуді тоқтатады және шарт орындалғанға дейін қосымша компонент ұсынады.
Vue жаңартуларымен керемет нәрселердің бірі - олардың артқа үйлесімділігі. Олар сіздің Vue жобаларыңызды бұзғаныңызды қаламайды. Біз мұны 1,0-ден 2,0-қа дейінгі көші-қон кезінде көрдік, мұнда API-нің 90 пайызы бірдей болатын.
Фреймворктардың синтаксисі қалай салыстырылады?
Шығарылымнан бастап барлық үш жақтаулар өзгерді, бірақ түсінетін бір нәрсе - синтаксис және оның айырмашылығы. Қарапайым оқиғаларды байланыстыру кезінде синтаксисті қалай салыстыратынын қарастырайық:
Үн: The v-on директива Vue даналарында әдістер қолданатын оқиға тыңдаушыларын бекіту үшін қолданылады. Директивалар префикстен тұрады v- олар Vue ұсынған ерекше атрибуттар екенін көрсету үшін және көрсетілген DOM-ға ерекше реактивті мінез-құлықты қолданады. Оқиға өңдеушілер кірістірілген немесе әдіс атауы ретінде ұсынылуы мүмкін.
шаблон> батырма v-on: click = «clickHandler»> мені нұқыңыз / батырма> / шаблон> сценарий> экспорттау әдепкі {ат: «HelloWorld», әдістері: {clickHandler: function () {console.log («Мен басылдым! »); }}}; / сценарий>
Реакция: React белгісі мен логикасын JS және JSX-ке, яғни JavaScript-ке синтаксистік кеңейтуге орналастырады. JSX көмегімен функция оқиғалар өңдеушісі ретінде беріледі. Оқиғаларды React элементтерімен өңдеу DOM элементтеріндегі оқиғаларға ұқсас. Бірақ кейбір синтаксистік айырмашылықтар бар; мысалы, React оқиғалары кіші әріппен емес, camelCase көмегімен аталады.
function Button () {function clickHandler (e) {console.log («Мен басылдым»); } қайтару түймесі onClick = {clickHandler}> Мені нұқыңыз! / button>; }
Бұрыштық: Оқиғаларды байланыстыру синтаксисі тең белгінің сол жағындағы жақшаның ішіндегі мақсатты оқиға атауынан және оң жақта келтірілген шаблон операторынан тұрады. Сонымен қатар, сіз қосулы канондық форма ретінде белгілі префикс.
@Component ({selector: «app-click-me», шаблон: `button (click) =« onClickMe () »> Мені нұқыңыз! / Button>`}) экспорттау класы ClickMeComponent {onClickMe () {console.log (“ Сіз мені нұқтыңыз! »); }}
Танымалдық және нарық
W3Techs статистикасын зерттей отырып, интернеттің қалған бөлігіне қатысты үш құрылымның жалпы суретін қарастырудан бастайық. Қазіргі уақытта бұрыштықты барлық веб-сайттардың 0,4 пайызы қолданады, олардың JavaScript кітапхана нарығында үлесі 0,5 пайызды құрайды. React барлық веб-сайттардың 0,3 пайызын және JavaScript кітапханасының 0,4 пайыз үлесін пайдаланады, ал Vue-дің екеуіне де 0,3 пайызы бар. Бұл біркелкі болып көрінеді және сіз сандардың өсетінін күтуге болады.
Google трендтері: Соңғы 12 ай ішінде React іздеу терминдерінің ішіндегі ең танымал болып табылады, оны Angular қадағалайды. Vue.js - бұл өте артта; дегенмен, есте сақтайтын бір нәрсе - Вуэдің қалған екеуімен салыстырғанда әлі жас екендігі.
Жұмыс іздеу: Жазу кезінде React және Angular, Vue-де жұмыс тізімінің тұрғысынан өте жақсы сәйкес келеді. LinkedIn-те Vue әзірлеушілеріне сұраныс көп сияқты.
Стек толуы: Егер сіз 2019 жылға арналған Stack Overflow Developer сауалнамасының нәтижелерін қарасаңыз, React және Vue.js - бұл ең сүйікті және ізделетін веб-құрылымдар. Бұрыш ең жақсы көретін, бірақ үшінші орын алатын адамдар үшін тоғызыншы орынға отырады.
GitHub: Vue-де ең көп жұлдыздар саны - 153 к, бірақ салымшылар саны ең аз (283). Екінші жағынан, реакцияның 140к жұлдыздары мен 1341 қатысушылары бар. Бұрыштық жұлдыздар тек 59,6 мың жұлдызды құрайды, бірақ олардың ішіндегі ең көп салымшылар саны - 1579.
NPM тенденциялары: Жоғарыдағы суретте соңғы 12 айдағы статистика көрсетілген, мұнда React-тің ай сайын жүктеу саны Angular және Vue-ге қарағанда көбірек екенін көруге болады.
Мобильді қосымшаларды әзірлеу
Үштікке басты назар аударатын нәрсе - мобильді орналастыру. React-та React Native бар, ол iOS және Android қосымшаларын React қолданушылары үшін ғана емес, сонымен қатар қолданбаны дамыту қауымдастығы үшін танымал таңдау болды. Бұрыштық әзірлеушілер NativeScript-ті жергілікті қосымшалар үшін немесе Ionic гибридті мобильді қосымшалар үшін қолдана алады, ал Vue әзірлеушілерде NativeScript немесе Vue Native таңдау мүмкіндігі бар. Мобильді қосымшалардың танымал болғандықтан, бұл инвестициялаудың негізгі бағыты болып қала береді.
2020 жылы күтілетін басқа негіздер
Егер сіз 2020 жылы жаңа нәрсе көргіңіз келсе, осы JavaScript құрылымдарын тексеріңіз.
Ембер: MVVM үлгісі негізінде жұмыс істейтін веб-қосымшаларды құруға арналған ашық көзді құрылым. Оны Microsoft, Netflix және LinkedIn сияқты бірнеше ірі компаниялар пайдаланады.
Метеор: Заманауи веб және мобильді қосымшаларды жасауға арналған толық стек JavaScript платформасы. Мұны үйрену оңай және оны қолдайтын қоғамдастық бар.
Қорытынды
Барлық үш жақтау үнемі жетілдіріліп отырады, бұл жігерлендіретін белгі. Әрқайсысының қайсысын қолданатыны туралы өз көзқарасы мен таңдаулы шешімі бар, бірақ бұл шынымен жобаның көлеміне келіп тіреледі және бұл сізге өзіңізді жайлы сезінеді.
Ең маңызды аспект - бұл олардың қоғамдастығының тұрақты қолдауы, сондықтан егер сіз жаңа жобаны бастауды жоспарлап отырсаңыз және осы уақытқа дейін үшеуінің ешқайсысын пайдаланбаған болсаңыз, онда мен сіздердің барлығыңызбен сенімді қолдарыңызда екеніңізге сенемін. Егер сізде үш жақтаулардың бірін білуге әлі мүмкіндігіңіз болмаса, мен оқуды бастау үшін жаңа жылдық шешім қабылдауды ұсынамын. Болашақ осы үшеуінің айналасында болады.
Бұл мазмұн бастапқыда нет журналда пайда болды.
