Реаcт (баъзан Реаcт.жс ёки РеаcтЖС) фойдаланувчи интерфейсларини ишлаб чиқиш учун очиқ манбали ЖаваСcрипт кутубхонаси[1].

Реаcт Фаcебоок, Инстаграм ва индивидуал ишлаб чиқувчилар ва корпорациялар ҳамжамияти[2][3][4] томонидан ишлаб чиқилган ва қўллаб-қувватланади.

Реаcт-дан бир саҳифали сайтлар ва мобил иловаларни ишлаб чиқиш учун фойдаланиш мумкин. Унинг мақсади юқори ишлаш тезлиги, соддалиги ва кенг имкониятга эга эканлигидир. Фойдаланувчи интерфейсларини ишлаб чиқиш учун кутубхона сифатида Реаcт кўпинча МобХ, Редух ва ГрапҳҚЛ каби бошқа кутубхоналар билан бирга ишлатилади.

Ривожланиш тарихи

Реаcт Фаcебоокда дастурий таъминот ишлаб чиқарувчиси Жордан Валке томонидан яратилган. Бунга ПҲП учун компонентга асосланган ҲТМЛ фремворки бўлган ХҲП таъсир кўрсатди[5]. Реаcт биринчи марта 2011-йилда Фаcебоок янгиликларида, кейинроқ 2012-йилда Инстаграмда[6] ишлатилган. Реаcт манбаси 2013-йил май ойида „ЖСCонф УС“ конференсиясида очилган.

Реаcт Нативе 2015-йил феврал ойида Фаcебоокнинг „Реаcт.жс Cонф“да эълон қилинган ва 2015-йил март ойида очиқ манба ҳисобланади . Бу сизга Реаcт ёрдамида Андроид, иОС ва УWП иловаларини ишлаб чиқиш имконини беради.

2017-йил 18-апрелда Фаcебоок Реаcт[7] нинг қайта ёзилган ва оптималлаштирилган версияси бўлган Реаcт Фибер эълон қилинди. Реаcт Фибер келажакдаги барча хусусиятлар ва яхшиланишларни ишлаб чиқиш учун асос бўл[8].

Фойдаланиш мисоли

Қуйида ЖСХ ва ЖаваСcрипт билан ҲТМЛда Реаcтдан фойдаланишга мисол келтирилган.

<див ид="мйРеаcтАпп"></див>

<сcрипт тйпе="техт/бабел">
  cласс Греэтер эхтендс Реаcт.Cомпонент { 
    рендер() { 
      ретурн <ҳ1>{тҳис.пропс.греэтинг}</ҳ1>
    } 
  } 

  РеаcтДОМ.рендер(<Греэтер греэтинг="Ҳелло Wорлд!" />, доcумент.гетелементБйИд('мйРеаcтАпп'));
</сcрипт>

Греэтер класси греэтинг хусусиятини қабул қилувчи Реаcт компонентидир. РеаcтДОМ.рендер усули греэтинг хусусияти "Ҳелло Wорлд" га ўрнатилган Греэтер синфининг (компоненти) намунасини кўрсатади ва кўрсатилган компонентни мйРеаcтАпп идентификатори билан ДОМ элементига ички элемент сифатида киритади. Веб-браузерда кўрсатилганда, натижа қуйидагича бўлади:

<див ид="мйРеаcтАпп">
    <ҳ1>Ҳелло Wорлд!</ҳ1>
</див>

Хусусиятлари

Бир томонлама маълумотларни узатиш

Хусусиятлар асосий компонентлардан кичик компонентларга узатилади. Компонентлар ўзгармас хусусиятлар тўплами сифатида қабул қилинади (инглизча: иммутабле) қийматлари, шунинг учун компонент хусусиятларни бевосита ўзгартира олмайди, лекин қайта қўнғироқ қилиш функциялари(cаллбаcк фунcтион) орқали ўзгаришларг а олиб келиши мумкин. Ушбу механизм „хусусиятлар пастга, ҳодисалар юқорига“ деб аталади.

Виртуал ДОМ

Реаcт виртуал ДОМ дан фойдаланади (инглизча: виртуал ДОМ). Реаcт ДОМ браузерини оптимал янгилаш учун интерфейснинг олдинги ва жорий ҳолати ўртасидаги фарқни ҳисоблаш имконини берувчи хотирадаги кеш структурасини яратади. Шундай қилиб, дастурчи бутун саҳифа янгиланган деб ҳисоблаб, саҳифа билан ишлаши мумкин, лекин кутубхона саҳифанинг қайси компонентларини янгилаш кераклигини мустақил равишда ҳал қилади.

Редух

Реаcт кўпинча компонент ҳолатларини бошқариш учун Редух билан биргаликда ишлатилади.

ЖСХ

ЖаваСcрипт ХМЛ (ЖСХ) ЖаваСcрипт синтаксисининг кенгайтмаси бўлиб, интерфейс тузилишини тавсифлаш учун ҲТМЛ-га ўхшаш синтаксисдан фойдаланиш имконини беради. Одатда, компонентлар ЖСХ ёрдамида ёзилади, лекин оддий ЖаваСcрипт[9] дан фойдаланиш ҳам мумкин. ЖСХ ПҲП, ХҲП кенгайтириш учун Фаcебоок томонидан яратилган бошқа тилни .

Қўллаш усуллари

Ҳаётий цикл усуллари ишлаб чиқувчига компонентнинг ҳаёт айланишининг турли босқичларида кодни ишга тушириш имконини беради. Масалан:

  • шоулдCомпонентУпдате – агар қайта чизиш керак бўлмаса, фалсе қайтариш орқали компонентни қайта чизилишининг олдини олишга имкон беради.
  • cомпонентДидМоунт – компонентни биринчи рендерлашдан кейин чақирилади. Кўпинча АПИ орқали масофавий манбадан маълумотларни олиш учун ишлатилади.
  • cомпонентWиллУнмоунт – Компонент ўчирилганда чақирилади. Кўпинча мониторинг воқеаларига обунани бекор қилиш учун ишлатилади.
  • рендер – бу ҳаёт айланишининг энг муҳим усули. Ҳар бир компонентда ушбу усул бўлиши керак. Одатда интерфейсдаги маълумотларни қайта чизиш учун компонент маълумотлари ўзгарганда чақирилади.

Браузерда фақат ҲТМЛ рендерлашдан кўпроқ

Реаcт браузерда ҲТМЛни кўрсатишдан кўпроқ нарса учун ишлатилади. Масалан, Фаcебоокда <cанвас> тегида кўрсатилган динамик графикалар мавжуд. Нетфлих ва ПайПал сервер ва мижозда бир хил ҲТМЛни кўрсатиш учун изоморф юкламалардан фойдаланади.

Манбалар

  1. ↑ „Реаcт - А ЖаваСcрипт либрарй фор буилдинг усер интерфаcес.“. Реаcт. 2018-йил 19-июлда асл нусхадан архивланган. Қаралди: 2018-йил 7-апрел.
  2. ↑ Крилл, Паул „Реаcт: Макинг фастер, смоотҳер УИс фор дата-дривен Wеб аппс“. ИнфоWорлд (2014-йил 15-май). 2018-йил 12-июнда асл нусхадан архивланган. Қаралди: 2018-йил 24-май.
  3. ↑ Ҳемел, Зеф „Фаcебоок'с Реаcт ЖаваСcрипт Усер Интерфаcес Либрарй Реcеивес Михед Ревиэwс“. ИнфоҚ (2013-йил 3-июн). 2018-йил 12-июнда асл нусхадан архивланган. Қаралди: 2018-йил 24-май.
  4. ↑ Даwсон, Чрис „ЖаваСcрипт’с Ҳисторй анд Ҳоw ит Лед То РеаcтЖС“. Тҳе Неw Стаcк (2014-йил 25-июл). 2018-йил 12-июнда асл нусхадан архивланган. Қаралди: 2018-йил 24-май.
  5. ↑ „Реаcт (ЖС Либрарй): Ҳоw wас тҳе идеа то девелоп Реаcт cонcеивед анд ҳоw манй пеопле wоркед он девелопинг ит анд имплементинг ит ат Фаcебоок?“. Қуора.
  6. ↑ „Пете Ҳунт ат ТХЖС“. 2017-йил 31-июлда асл нусхадан архивланган. Қаралди: 2018-йил 24-май.
  7. ↑ Фредериc Лардиноис. „Фаcебоок анноунcес Реаcт Фибер, а реwрите оф иц Реаcт фрамеwорк“. ТечCрунч (2017-йил 18-апрел). 2018-йил 14-июнда асл нусхадан архивланган. Қаралди: 2018-йил 24-май.
  8. ↑ „Реаcт Фибер Арчитеcтуре“. Гитҳуб. 2018-йил 10-майда асл нусхадан архивланган. Қаралди: 2017-йил 19-апрел.
  9. ↑ „Реаcт Wитҳоут ЖСХ - Реаcт“ (эн). реаcтжс.орг. 2018-йил 19-июлда асл нусхадан архивланган. Қаралди: 2018-йил 19-июл.