React (JavaScript գրադարան)

Վիքիպեդիայից՝ ազատ հանրագիտարանից
React (JavaScript գրադարան)
Изображение логотипа
Տեսակազատ և բաց ծրագրային ապահովում, վեբ ծրագրի հենք, ծրագրային գրադարան և ՋավաՍկրիպտ գրադարան
ՀեղինակMeta Platforms
Նախագծումը՝Meta Platforms, Jordan Walke?, Sebastian Markbåge?, Dan Abramov?, Rachel Nabors? և Andrew Clark?
Գրված է՝ՋավաՍկրիպտ
ՕՀբազմապլատֆորմ
Լույս տեսավ՝մայիսի 29, 2013
Վերջին կայուն տարբերակ18.2.0 (հունիսի 14, 2022)[1]
ԱրտոնագիրMIT արտոնագիր[2][3]
Կայքhy.reactjs.org
Աղբյուր կոդgithub.com/facebook/react

React (երբեմն ձևակերպված է React.js կամ ReactJS), բաց կոդով JavaScript գրադարան է[4] user ինտերֆեյս կառուցելու համար։

Մշակվում է Ֆեյսբուքի, Ինստագրամի և առանձին մշակողների կողմից[5][6][7]։ Ըստ Libscore ծառայության ՋավաՍկրիպտի վերլուծաբանների՝ React-ը այժմ օգտագործվում է Նեթֆլիքս, Imgur, Buffer, Bleacher Report, Feedly, Airbnb, SeatGeek, HelloSign, Walmart, և այլ վեբ կայքերում[8]։

React-ը թույլ է տալիս մշակողներին ստեղծել խոշոր վեբ ծրագիր, որը օգտագործում է տվյալներ, որոնք ժամանակի ընթացքում փոխվում են առանց էջը վերբեռնելու։ Դրա հիմնական նպատակը արագ, պարզ և լայնածավալ լինելն է։ React-ը ծրագրերում գործի է դնում միայն օգտատիրոջ ինտերֆեյսը։ Այն համապատասխանում է View-ին Model-View-Controller (MVC) կաղապարում, և կարող է օգտագործվել ՋավաՍկրիպտի այլ գրադարանների կամ ֆրեյմվորկերի հետ MVC-ում, ինչպես AngularJS-ն է[9]։

Պատմություն[խմբագրել | խմբագրել կոդը]

React-ը ստեղծվել է Ջորդան Ուոլքի կողմից, ով ծրագրային ապահովման ինժեներ է Ֆեյսբուքում։ Նա ոգեշնչվել է XHP-ով, որը HTML բաղադրիչ ֆրեյմվորկ է PHP-ի համար[10]։ Այն առաջին անգամ տեղակայվել է Ֆեյսբուքի լրահոսում 2011 թվականին և ավելի ուշ՝ 2012 թվականին՝ Instagram.com-ում [11]։ Այն բաց էր JSConf US-ում 2013 թվականի մայիսին։ React Native-ը, որը հնարավորություն է տալիս React-ով մշակում բնիկ iOS-ին, Android-ին և UWP-ին, հայտարարվել է Facebook's React.js Conf-ին 2015 թվականի փետրվարին և բաց էր 2015 թվականի մարտին։ 2017 թվականի ապրիլի 18-ին, Facebook-ը հայտարարեց React Fiber-ի մասին, որը React ֆրեյմվորկի գրադարանի նոր էական ալգորիթմ էր user ինտերֆեյս կառուցելու համար[12]։ React Fiber-ը կդառնա ցանկացած բարելավումների և React ֆրեյմվորկի հատկանիշների զարգացման հիմնադիր [13]։

Նշանակալից հատկություններ[խմբագրել | խմբագրել կոդը]

Միակողմանի տվյալների հոսք[խմբագրել | խմբագրել կոդը]

Անփոփոխ արժեքների շարքը փոխանցվում է բաղադրիչի մատուցողին որպես HTML tag-ի հատկություններ։ Բաղադրիչը չի կարող ուղղակիորեն փոփոխել իրեն փոխանցված որևէ հատկություն, սակայն կարող է փոխանցվել callback գործառույթներ, որոնք փոփոխում են արժեքները։ Այս մեխանիզմի խոստումը արտահայտվում է որպես «հատկությունները ներքև են հոսում, գործողությունները՝ վեր»։

Վիրտուալ DOM[խմբագրել | խմբագրել կոդը]

Այլ նշանակալի հատկություն է «վիրտուալ Document Object Model»-ի կամ «վիրտուալ DOM»-ի օգտագործումը։ React-ը ստեղծում է հիշողության մեջ տվյալների կառուցվածքի հիշապահեստ, հաշվում է արդյունքի փոփոխությունները և հետո արդյունավետորեն նորացնում բրաուզերի ներկայացված DOM[14]: Դա թույլ է տալիս ծրագրավորողին գրել կոդն այնպես, որ ամբողջ էջը ներկայացվի յուրաքանչյուր փոփոխության ժամանակ, մինչդեռ React գրադարանները ներկայացնում են միայն ենթաբաղադրիչները, որոնք իրականում փոփոխում են։

JSX[խմբագրել | խմբագրել կոդը]

React բաղադրիչները հիմնականում գրված են JSX-ով, որը JavaScript ընդլայնման շարահյուսություն է, որը թույլ է տալիս նշել HTML-ը և օգտագործել HTML թեգերի շարահյուսությունը ենթաբաղադրիչները ներկայացնելու համար [15]։ Դա React-ին հատուկ JavaScript-ի քերականական ընդլայնում է ինչպես այժմ անջատված E4X-ը։ HTML շարահյուսությունը գործածվում է React ֆրեյմվորկի JavaScript-ի կանչերում։ Մշակողները կարող են գրել նաև մաքուր JavaScript-ով։ JSX-ը նման է PHP, XHP-ի համար Facebook-ի ստեղծած մեկ այլ ընդլայնման շարահյուսությանը։ JSX-ը նման է սովորական HTML-ին։ JSX կոդի օրինակ։

import React from 'react';

class App extends React.Component {
   render() {
      return (
         <div>
               <p>Header</p>
               <p>Content</p>
               <p>Footer</p>
         </div>
      );
   }
}

export default App;
Ներդրված տարրեր

Բազմաթիվ տարրեր կարիք ունեն փաթեթավորվել մեկ պահոցում ինչպես վերը նշված <div> տարրն է։

Հատկանիշներ

Հարմարեցված հատկանիշները աջակցվում են ի հավելում HTML-ի հատկանիշների։ Հարմարեցված հատկանիշները պետք է ավելացվեն data- նախածանցով։

Javascript արտահայտություններ

Javascript արտահայտությունները կարող են օգտագործվել JSX-ի ներսում ձևավոր փակագծերով {}:

import React from 'react';

class App extends React.Component {
   render() {
      return (
         <div>
            <h1>{10+1}</h1>
         </div>
      );
   }
}

export default App;

Վերևի օրինակը կներկայացնի "11":

Եռյակ գործողություններ

If–else պնդումները չեն կարող օգտագործվել JSX-ում, բայց փոխարենը կօգտագործվեն եռյակ արտահայտություններ։ Վարը օրինակում բրաուզերը կներկայացնի "true", որովհետև i -ն հավասար է 1-ին։

import React from 'react';

class App extends React.Component {
   render() {
      var i = 1;
      return (
         <div>
            <h1>{ i === 1 ? 'true' : 'false' }</h1>
         </div>
      );
   }
}

export default App;

Ճարտարապետություն HTML-ից անդին[խմբագրել | խմբագրել կոդը]

React-ի հիմնական ճարտարապետությունը կիրառում է բրաուզերում HTML-ից դուրս ներկայացում։ Օրինակ՝ Facebook-ը ունի դինամիկ գծապատկերներ, որոնք ներկայացնում են <canvas> թեգեր[16], իսկ Netflix-ը և PayPal-ը օգտագործում են իզոմորֆիկ բեռնում և՛ սերվերի, և՛ client-ի մասում միանման HTML ներկայացնելու համար[17][18]։

React Native[խմբագրել | խմբագրել կոդը]

React Native գրադարանները հրապարակվել են Facebook-ի կողմից 2015 թվականին[19]՝ տալով React ճարտարապետություն բնիկ iOS-ին, Android-ին և UWP[20] ծրագրերին։

Ապագա զարգացում[խմբագրել | խմբագրել կոդը]

Նախագծի կարգավիճակը կարող է հետևել հիմնական թիմի քննարկման ֆորումի միջոցով[21]։ Այնուամենայնիվ React-ի կարևոր փոփոխությունները անցնում են Future of React repo-ի, Issues-ի և PR-ի միջով[22][23]։ Դա հնարավորություն է տալիս React-ի հասարակությանը տալ հետադարձ արձագանք նոր պոտենցիալ հատկությունների, էսպերիմենտալ API-երի և JavaScript-ի շարահյուսության բարելավումների մասին։

Facebook CLA[խմբագրել | խմբագրել կոդը]

Facebook-ը պահանջում է React ներդրողներ Facebook CLA-ը ստորագրելու համար[24][25]։

Լիցենզավորում[խմբագրել | խմբագրել կոդը]

2013 թվականի մայիսին React-ի սկզբնական հրապարակային թողարկումը օգտագործել է Apache License 2.0: 2014 թվականի հոկտեմբերին React 0.12.0-ը փոխարինել է այն 3-clause BSD license-ով և ավելացրել առանձին PATENTS տեքստային ֆայլ, որը թույլատրում է ծրագրային ապահովման հետ կապված ցանկացած Facebook արտոնագրի օգտագործում[26]։

«Սույնով տրված արտոնագիրը կդադարեցվի, ավտոմատ կերպով եւ առանց ծանուցման, ցանկացած մարդու համար, ով ներկայացնում է ցանկացած պահանջ (ներառյալ ցանկացած դատական հայց լրացնել, պնդում կամ այլ գործողություններ) պնդելով (ա) ուղղակի, անուղղակի կամ նպաստող խախտում կամ խթանում ցանկացած արտոնագիր խախտելու համար՝ (1) Facebook-ի կամ դրա ցանկացած այլ դուստր կազմակերպությունների կամ ստորաբաժանումների կողմից, անկախ նրանից՝ այդ պնդումը կապ ունի Facebook ծրագրի հետ, թե ոչ, (2) ցանակացած այլ կողմի կողմից, եթե այդպիսի պնդումը ընդհանուր կամ մասնակիորեն Facebook-ի կամ դրա ցանկացած այլ դուստր կազմակերպությունների կամ ստորաբաժանումների ցանկացած ծրագրային ապահովումից, արտադրանքից կամ ծառայությունից, անկախ նրանից՝ այդ պնդումը կապ ունի Facebook ծրագրի հետ, թե ոչ, կամ (3) ցանակացած այլ կողմի կողմից, որը կապված է Facebook ծրագրային ապահովման հետ, կամ, (բ) որ ցանկացած իրավունք Facebook-ի ցանկացած արտոնագրի պնդման մեջ անվավեր կամ անգործունակ է»։

Այս աննախընտրելի դրույթը որոշակի հակասություններ ու բանավեճեր է առաջացրել React օգտագործող համայնքում, քանի որ այն կարելի է մեկնաբանել որպես Facebook-ի լիազորությունները թուլացնելու, լիցենզիան բազմաթիվ սցենարներում վերացնելու փորձ, օրինակ, եթե Ֆեյսբուքը դատի է տալիս լիցենզավորված անձին, որը դրդում է նրանց «այլ գործողության»՝ հրապարակելով գործողությունը բլոգում կամ այլ տեղ։ Շատերը մտահոգություն են հայտնում, որ Facebook-ը կարող է անարդարացիորեն շահագործել դադարեցման կետը կամ, որ ինտեգրումը React-ին արտադրանքի մեջ կարող է բարդացնել նորաստեղծ ընկերության հետագա ձեռքբերումը[27]։

Հիմնվելով հասարակության արձագանքին՝ Facebook-ը նորացրեց 2015 թվականի ապրիլին տրված արտոնագիրը ավելի հասկանալի և թույլատրելի լինելու համար [28]։

«Սույնով տրված արտոնագիրը կդադարեցվի, ավտոմատ կերպով եւ առանց ծանուցման, եթե դու (կամ քո ցանկացած դուստր կազմակերպությունները, կորպորացիոն ստորաբաժանումները կամ agents) սկիզբ դնեն Արտոնագրային հավաստում ուղղակի կամ անուղղակի կերպով, կամ ուղղակի հետապնդեն ֆինանսական հետաքրքրություն դրա նկատմամբ՝ (1) Facebook-ի կամ դրա ցանկացած այլ դուստր կազմակերպությունների կամ կորպորացիոն ստորաբաժանումների դեմ, (2) ցանկացած այլ կողմի դեմ, եթե այդպիսի Արտոնագրային հավաստումը ընդհանուր կամ մասնակիորեն Facebook-ի կամ դրա ցանկացած այլ դուստր կազմակերպությունների կամ կորպորացիոն ստորաբաժանումների ինչ-որ ծրագրային ապահովումից, արտադրանքից կամ ծառայությունից է, կամ (3) ցանկացած այլ կողմի դեմ, որը կապված է Facebook ծրագրային ապահովման հետ։ [...] «Արտոնագրային հավաստումը» ցանկացած դատական կամ այլ գործողություն է, որը պնդում է ուղղակի կամ անուղղակի կամ նպաստող խախտում կամ խթանում ցանկացած արտոնագրի խատման համար՝ ներառելով խաչաձև հայց կամ հակափաստարկ»[29]:

Արտոնագրի այս երկրորդ տարբերակը մնաց հակասական՝ դարձնելով ֆրեյմվորկի օգտագործումը անընդունելի որոշ ծրագրավորողների համար։ Դա այն պատճառով է, որ փաստաթուղթը շարունակում է թույլ տալ Facebook-ին հրաժարվել ֆեյսբուքյան արտոնագրերի տակ գտնվող ֆրեյմվորկի օգտագործման իրավունքից, այն դեպքում, երբ լիցենզավորված անձը Facebook-ի դեմ ուղղված արտոնագրային հայց է ներկայացրել[30]։

Ծանոթագրություններ[խմբագրել | խմբագրել կոդը]

  1. 18.2.0 (June 14, 2022)
  2. React v16.0
  3. Change license and remove references to PATENTS
  4. «A JavaScript library for building user interfaces - React»։ facebook.github.io։ Վերցված է 2017-04-13 
  5. «React: Making faster, smoother UIs for data-driven Web apps»։ InfoWorld 
  6. «Facebook's React JavaScript User Interfaces Library Receives Mixed Reviews»։ InfoQ 
  7. «JavaScript’s History and How it Led To ReactJS»։ The New Stack 
  8. «Libscore»։ libscore.com 
  9. «ReactJS vs AngularJS 2 ultimate performance research - Cleveroad»։ փետրվարի 22, 2017 
  10. «React (JS Library): How was the idea to develop React conceived and how many people worked on developing it and implementing it at Facebook?»։ Quora 
  11. «Pete Hunt at TXJS» 
  12. Frederic Lardinois (ապրիլի 18, 2017)։ «Facebook announces React Fiber, a rewrite of its React framework»։ TechCrunch։ Վերցված է ապրիլի 19, 2017 
  13. «React Fiber Architecture»։ Github։ Վերցված է ապրիլի 19, 2017 
  14. «Working With the Browser»։ React։ Արխիվացված է օրիգինալից 2016-05-29-ին։ Վերցված է 2017-07-07 
  15. «JSX in Depth»։ Վերցված է 2015-11-17 
  16. «Why did we build React? – React Blog» 
  17. «PayPal Isomorphic React» 
  18. «Netflix Isomorphic React» 
  19. «React Native: Bringing modern web techniques to mobile» 
  20. Windows Apps Team (April 13, 2016)։ «React Native on the Universal Windows Platform»։ blogs.windows.com։ Վերցված է 2016-11-06 
  21. «Meeting Notes»։ React Discuss։ Արխիվացված է օրիգինալից 2015-12-22-ին։ Վերցված է 2015-12-13 
  22. «reactjs/react-future - The Future of React»։ GitHub։ Վերցված է 2015-12-13 
  23. «facebook/react - Feature request issues»։ GitHub։ Վերցված է 2015-12-13 
  24. «facebook/react - CONTRIBUTING.md»։ GitHub։ Վերցված է 2015-12-13 
  25. «Contributing to Facebook Projects»։ Facebook Code։ Վերցված է 2015-12-13 
  26. «React CHANGELOG.md»։ GitHub 
  27. Liu Austin։ «A compelling reason not to use ReactJS»։ Medium 
  28. «Updating Our Open Source Patent Grant» 
  29. «Additional Grant of Patent Rights Version 2»։ GitHub 
  30. «Legal Department Did not Allow Use of React»։ Արխիվացված է օրիգինալից 2016-11-09-ին։ Վերցված է 2017-07-07 

Արտաքին հղումներ[խմբագրել | խմբագրել կոդը]