යාවත්කාලීන කිරීම: මෙම පිළිතුර ඉතා ජනප්‍රිය බව පෙනේ, එබැවින් එය ටිකක් පිරිසිදු කිරීමට, නව තොරතුරු කිහිපයක් එකතු කිරීමට සහ ප්‍රමාණවත් තරම් පැහැදිලි නැති යැයි මා සිතූ කරුණු කිහිපයක් පැහැදිලි කිරීමට මම යම් කාලයක් ගත කළෙමි. වෙනත් දෙයකට පැහැදිලි කිරීමක් හෝ යාවත්කාලීන කිරීම් අවශ්ය යැයි ඔබ සිතන්නේ නම් කරුණාකර අදහස් දක්වන්න.
ඔබගේ බොහෝ කාරණා ඇත්ත වශයෙන්ම මතයක් සහ පෞද්ගලික මනාපයක් වන නමුත් මට හැකි තරම් වෛෂයිකව පිළිතුරු දීමට මම උත්සාහ කරමි:
ස්වදේශීය එදිරිව
වැනිලා ජාවාස්ක්‍රිප්ට් හි ජාවාස්ක්‍රිප්ට් ලියන්න, CSS හි CSS ලියන්න, HTML හි HTML ලියන්න.
ඔබ විසින් එකලස් කිරීමේ කේතය ජනනය කිරීමට සම්පාදකයා සෑදීම සඳහා යමෙකු ස්වදේශීය එක්රැස්වීම අතින් ලිවිය යුතුද නැතහොත් සී වැනි ඉහළ මට්ටමේ භාෂාවක් භාවිතා කළ යුතුද යන්න පිළිබඳව උණුසුම් විවාද පැවතුනි . ඊට පෙර පවා මිනිසුන් එකලස් කරන්නන් විශ්වාස කිරීම ප්‍රතික්ෂේප කළ අතර ස්වදේශීය යන්ත්‍ර කේත අතින් ලිවීමට කැමැත්තක් දැක්වූහ ( මම විහිළුවක් නොකරමි ).
මේ අතර, අද HTML ලියන්න අය ගොඩක් තිබෙනවා Haml හෝ ජේඩ් , දී CSS Sass හෝ අඩු හා JavaScript CoffeeScript හෝ TypeScript . එය තියෙනවා. එය වැඩ කරනවා. සමහර අය එයට කැමතියි, සමහරු කැමති නැත.
කාරණය වන්නේ වැනිලා ජාවාස්ක්‍රිප්ට් හි ජාවාස්ක්‍රිප්ට්, CSS හි CSS සහ HTML හි HTML ලිවීමෙහි මූලික වශයෙන් වැරැද්දක් නොමැති බවයි. එය සැබවින්ම මනාපය.
අභ්‍යන්තර එදිරිව බාහිර ඩීඑස්එල්
ජාවාස්ක්‍රිප්ට් හි CSS ලිවීම අවශ්ය වන ෂැඩෝ ඩොම් ප්රතික්රියා භාවිතා කරමින් ස්ටයිල් එන්කැප්ලේෂන් සඳහා මෙය ඇත. ලස්සන නැහැ.
ලස්සන හෝ නැත, එය නිසැකවම ප්රකාශිත ය. ජාවාස්ක්‍රිප්ට් යනු සීඑස්එස් වලට වඩා බෙහෙවින් බලවත් භාෂාවකි (ඕනෑම CSS පෙර සැකසුම් ඇතුළුව). එය යම් ආකාරයක රඳා පවතින්නේ ඔබ ඒ ආකාරයේ දේවල් සඳහා අභ්‍යන්තර හෝ බාහිර ඩීඑස්එල් වලට කැමතිද යන්න මතය. නැවතත්, මනාප කාරණයක්.
(සටහන: මම කතා කළේ මුල් ප්‍රශ්නයේ සඳහන් කර ඇති ප්රතික්රියා වල පේළිගත ශෛලීන් ගැන ය .)
ඩීඑස්එල් වර්ග - පැහැදිලි කිරීම
යාවත්කාලීන කිරීම: මගේ පිළිතුර ලිවීමෙන් ටික කලකට පසු එය කියවීමෙන් මා අදහස් කරන්නේ කුමක්ද යන්න මෙහි පැහැදිලි කළ යුතු යැයි මම සිතමි. ඩීඑස්එල් යනු වසම්-විශේෂිත භාෂාවක් වන අතර එය අභ්‍යන්තර විය හැකිය (ජාවාස්ක්‍රිප්ට් වැනි සත්කාරක භාෂාවේ වාක්‍ය ඛණ්ඩය භාවිතා කිරීම - උදාහරණයක් ලෙස ජේඑස්එක්ස් නොමැතිව ප්රතික්රියා කරන්න, හෝ ඉහත සඳහන් කළ ප්රතික්රියා වල පේළිගත ශෛලීන් වැනි) හෝ එය බාහිර විය හැකිය (වෙනස් සින්ටැක්ස් භාවිතා කරමින්) ධාරක භාෂාවට වඩා - මෙම උදාහරණයේ දී මෙන් ජාවාස්ක්‍රිප්ට් තුළ CSS (බාහිර DSL) ඇතුළත් කිරීම).
සමහර සාහිත්‍යයන් එම වර්ගයේ ඩීඑස්එල් විස්තර කිරීම සඳහා "අභ්‍යන්තර" සහ "බාහිර" වලට වඩා වෙනස් යෙදුම් භාවිතා කරන බැවින් එය ව්‍යාකූල විය හැකිය. සමහර විට "කාවැද්දූ" යන්න "අභ්‍යන්තර" වෙනුවට භාවිතා කර ඇති නමුත් "කාවැද්දූ" යන වචනයට විවිධ දේ අදහස් විය හැකිය - නිදසුනක් ලෙස ලූවා විස්තර කර ඇත්තේ "ලුආ: විස්තාරණය කළ හැකි කාවැද්දූ භාෂාවක්" ලෙසිනි. එහිදී කාවැද්දූ (අභ්‍යන්තර) ඩීඑස්එල් (සමග එය තරමක් ප්‍රතිවිරුද්ධ දෙයකි - බාහිර ඩීඑස්එල්) නමුත් එයින් අදහස් කරන්නේ එය SQLite කාවැද්දූ දත්ත සමුදායක් යන අර්ථයෙන් ම කාවැදී ඇති බවයි. තුන්වන අර්ථයෙන් “කාවැද්දූ” යන්නට “ඊ” යන්නෙන් අදහස් කෙරෙන ඊලූවා පවා ඇත - එය කාවැද්දූ පද්ධති සඳහා අදහස් කරන බව! "කාවැද්දූ ඩීඑස්එල්" යන යෙදුම භාවිතා කිරීමට මා අකමැති වන්නේ එබැවිනි. ඊලූවා වැනි දේ "ඩීඑස්එල්" විය හැකි අතර ඒවා විවිධ සංවේදක දෙකකින් "කාවැද්දූ" ඒවා වන අතර කිසිසේත්ම "කාවැද්දූ ඩීඑස්එල්" නොවේ!
තත්වය වඩාත් නරක අතට හැරවීම සඳහා සමහර ව්‍යාපෘති මිශ්‍රණයට ඊටත් වඩා ව්‍යාකූලත්වයක් ඇති කරයි. උදා. ෆ්ලැටිරෝන් සැකිලි "ඩීඑස්එල්-රහිත" ලෙස විස්තර කර ඇති අතර ඇත්ත වශයෙන්ම එය සින්ටැක්ස් වැනි අභ්‍යන්තර ඩීඑස්එල් සඳහා කදිම නිදසුනකි:map.where('href').is('/').insert('newurl');
මා පවසා ඇති පරිදි, "ජාවාස්ක්‍රිප්ට් යනු සීඑස්එස් වලට වඩා බොහෝ බලවත් භාෂාවකි (ඕනෑම සීඑස්එස් පෙර සැකසුම්කරුවන් ඇතුළුව). එය යම් ආකාරයක රඳා පවතින්නේ ඔබ ඒ ආකාරයේ අභ්‍යන්තර හෝ බාහිර ඩීඑස්එල් වලට කැමතිද යන්න මතය. නැවතත්, මනාප කාරණයක්. ” මම මේ අවස්ථා දෙක ගැන කතා කළා:
එක:
/** @jsx React.DOM */
var colored = {
color: myColor
};
React.renderComponent(<div style={colored}>Hello World!</div>, mountNode);
දෙක:
// SASS:
.colored {
color: $my-color;
}
// HTML:
<div class="colored">Hello World!</div>
පළමු උදාහරණයේ ප්‍රශ්නයේ විස්තර කර ඇති දේ භාවිතා කරයි: "ජාවාස්ක්‍රිප්ට් හි CSS ලිවීම. ලස්සන නැත." දෙවන උදාහරණය සාස් භාවිතා කරයි. CSS ලිවීම සඳහා ජාවාස්ක්‍රිප්ට් භාවිතා කිරීම ලස්සන නොවිය හැකි බව මම එකඟ වන අතර ("ලස්සන" යන්නෙහි සමහර අර්ථ දැක්වීම් සඳහා) නමුත් එය කිරීමෙන් එක් වාසියක් ඇත.
මට සාස් හි විචල්‍යයන් සහ ක්‍රියාකාරකම් තිබිය හැකි නමුත් ඒවා ශබ්දකෝෂයෙන් හෝ ගතිකව විෂය පථයෙන් යුක්තද? ඒවා සංඛ්‍යානමය හෝ ගතිකව ටයිප් කර තිබේද? ශක්තිමත් හෝ දුර්වලද? සංඛ්‍යාත්මක වර්ග ගැන කුමක් කිව හැකිද? සංයෝජනය ටයිප් කරන්න? කුමන සාරධර්ම සත්ය සහ ව්යාජ ඒවාද? මට ඉහළ පෙළේ කාර්යයන් කළ හැකිද? පුනරාවර්තනය? වලිග ඇමතුම්? ශබ්දකෝෂ වසා දැමීම්? ඒවා සාමාන්‍ය අනුපිළිවෙලින් හෝ යෙදවුම් අනුපිළිවෙලින් ඇගයීමට ලක් කෙරේද? කම්මැලි හෝ උනන්දුවෙන් ඇගයීමක් තිබේද? ශ්‍රිත සඳහා වන තර්ක අගය හෝ යොමු කිරීම මගින් සම්මත කර තිබේද? ඒවා විකෘතිද? වෙනස් කළ නොහැකිද? නොපසුබටද? වස්තූන් ගැන කුමක් කිව හැකිද? පංතිවල? මූලාකෘති? උරුමය?
ඒවා සුළුපටු ප්‍රශ්න නොවන අතර මට සාස් හෝ අඩු කේතය තේරුම් ගැනීමට අවශ්ය නම් ඒවාට පිළිතුරු දැන සිටිය යුතුය. මම දැනටමත් ජාවාස්ක්‍රිප්ට් සඳහා එම පිළිතුරු දනිමි, එයින් අදහස් කරන්නේ එම මට්ටම්වල සෑම අභ්‍යන්තර ඩීඑස්එල් (ප්රතික්රියා වල පේළිගත ශෛලීන් වැනි) මම දැනටමත් තේරුම් ගෙන ඇති බවයි, එබැවින් මම ප්රතික්රියා භාවිතා කරන්නේ නම් ඒ සඳහා පිළිතුරු ලබා ගත යුත්තේ එක් පිළිතුරක් පමණි (සහ බොහෝ සමාන ය ) ප්‍රශ්න, මම උදා. සාස් සහ හැන්ඩ්බාර් එවිට මට එම පිළිතුරු කට්ටල තුනක් දැනගත යුතු අතර ඒවායේ ඇඟවුම් තේරුම් ගත යුතුය.
එක් ක්‍රමයක් හෝ වෙනත් ක්‍රමයක් සෑම විටම වඩා හොඳ යැයි කීම නොවේ, නමුත් ඔබ වෙනත් භාෂාවක් මිශ්‍රණයට හඳුන්වා දෙන සෑම අවස්ථාවකම ඔබ බැලූ බැල්මට පැහැදිලිව පෙනෙන්නට නැති මිලක් ගෙවන අතර මෙම මිල සංකීර්ණ වේ.
මම මුලින් අදහස් කළේ කුමක්ද යන්න පැහැදිලි කර දෙනු ඇතැයි මම බලාපොරොත්තු වෙමි.
දත්ත බන්ධනය
ද්වි-මාර්ග බන්ධනය
මෙය සැබවින්ම සිත්ගන්නා කරුණක් වන අතර ඇත්ත වශයෙන්ම මනාපයක් ද වේ. ද්වි-මාර්ගය සෑම විටම එක් මාර්ගයකට වඩා හොඳ නැත. එය ඔබගේ යෙදුමේ විකෘති තත්වයක් නිරූපණය කරන්නේ කෙසේද යන්න පිළිබඳ ප්‍රශ්නයකි. ක්‍රියාකාරී ක්‍රමලේඛනයේ මූලධර්මවලට තරමක් පටහැනි අදහසක් ලෙස මම සෑම විටම ද්වි-මාර්ග බන්ධන බැලුවෙමි, නමුත් ක්‍රියාකාරී ක්‍රමලේඛනය ක්රියාත්මක වන එකම ආදර්ශය නොවේ, සමහර අය මේ ආකාරයේ හැසිරීමට කැමැත්තක් දක්වන අතර ප්‍රවේශයන් දෙකම ප්‍රායෝගිකව හොඳින් ක්රියාත්මක වන බව පෙනේ. ප්‍රතික්‍රියාකාරිත්වයේ රාජ්‍ය ආකෘතිකරණයට අදාළ සැලසුම් තීරණ පිළිබඳ විස්තර ගැන ඔබ උනන්දු වන්නේ නම් පීට් හන්ට්ගේ කතාව (ප්‍රශ්නයට සම්බන්ධයි) සහ ටොම් ඔචිනෝ සහ ජෝර්දාන් වල්ක්ගේ කතාව හොඳින් විස්තර කරන්න. මගේ මතය.
යාවත්කාලීන කිරීම: පීට් හන්ට්ගේ තවත් කතාවක් බලන්න: පුරෝකථනය කළ හැකි, නිවැරදි නොවේ: ක්‍රියාකාරී DOM ක්‍රමලේඛනය .
යාවත්කාලීන 2: බොහෝ සංවර්ධකයින් ද්විපාර්ශ්වික දත්ත ප්‍රවාහයට හෝ ද්වි-මාර්ග බන්ධනයට එරෙහිව තර්ක කරන බව සඳහන් කිරීම වටී , සමහරු එය ප්‍රති-රටාවක් ලෙසද හඳුන්වති. නිදසුනක් ලෙස, දැඩි දිශානුගත දත්ත ප්‍රවාහයකට පක්ෂව එම්වීසී ආකෘතිය (විශාල ෆේස්බුක් සහ ඉන්ස්ටග්‍රෑම් යෙදුම් සඳහා පරිමාණය කිරීම අසීරු බව ඔප්පු වූ) පැහැදිළිවම මගහරින ෆ්ලක්ස් යෙදුම් ගෘහ නිර්මාණ ශිල්පය ගන්න ( හැකර් මාර්ගය බලන්න : ෆේස්බුක් කතාවේදී නැවත සිතීමේ වෙබ් යෙදුම් සංවර්ධනය ටොම් ඔචිනෝ, ජිං චෙන් සහ පීට් හන්ට් හොඳ හැඳින්වීමක් සඳහා). එසේම, AngularJS ට එරෙහිව විශාල විවේචනයක් (ද්වි-මාර්ග දත්ත බන්ධනය සඳහා ප්‍රසිද්ධ MVC ආකෘතිය මත ලිහිල්ව පදනම් වූ වඩාත් ජනප්‍රිය වෙබ් රාමුවට) එම ද්විපාර්ශ්වික දත්ත ප්‍රවාහයට එරෙහි තර්ක ඇතුළත් වේ, බලන්න:
යාවත්කාලීනය 3: ඉහත සාකච්ඡා කර ඇති ගැටළු කිහිපයක් මනාව පැහැදිලි කරන තවත් රසවත් ලිපියක් වන්නේ ප්රතික්රියා ජේඑස් හි ප්‍රවාහය විසංයෝජනය කිරීම - රිෆ්ලැක්ස් ජේඑස් හි කතුවරයා වන මයිකල් බ්‍රැස්මන් විසිනි
යාවත්කාලීන 4: Ember.js දැනට ද්වි-මාර්ග දත්ත බන්ධනයෙන් away ත්වෙමින් පවතින අතර අනාගත අනුවාද වලදී එය පෙරනිමියෙන් එක් මාර්ගයක් වනු ඇත. බලන්න: 2014 නොවැම්බර් 15 වන දින ටොරොන්ටෝහි එම්බර්ගාර්ටන් සම්මන්ත්‍රණයෙන් ස්ටෙෆාන් පෙන්ර් විසින් එම්බර් කතාවේ අනාගතය .
යාවත්කාලීන 5: මෙයද බලන්න: එම්බර් 2.0 ආර්එෆ්සී වෙත යන මාර්ගය - ටොම් ඩේල්ගේ ඉල්ලීම පිළිබඳ සිත්ගන්නා සාකච්ඡාව :
“අපි මුල් සැකසුම් ස්තරය නිර්මාණය කරන විට, සියලු දත්ත බන්ධන දෙයාකාරයකින් සෑදීම එතරම් හානිකර නොවන බව අපි හදුනා ගත්තෙමු: ඔබ ද්වි-මාර්ග බන්ධනයක් සකසා නොමැති නම්, එය සත්ය වශයෙන්ම එක්-මාර්ග බන්ධනයකි!
අප ප්රතික්රියා කර ඇති අපගේ මිතුරන්ගෙන් යම් උපකාරයක් ලබාගෙන ඇති බව අපි තේරුම් ගෙන ඇත්තෙමු.
මීට අමතරව, සංරචක අතර සන්නිවේදනය බොහෝ විට ස්වාභාවිකවම සිදුවීම් හෝ ඇමතුම් ලෙස ප්‍රකාශ වේ. එම්බර්හි මෙය කළ හැකි නමුත් ද්වි-මාර්ග දත්ත බන්ධනවල ආධිපත්‍යය බොහෝ විට සන්නිවේදන නාලිකාවක් ලෙස ද්වි-මාර්ග බන්ධන භාවිතා කිරීමේ මාවතකට මිනිසුන් යොමු කරයි . පළපුරුදු එම්බර් සංවර්ධකයින් (සාමාන්‍යයෙන්) මෙම වැරැද්ද නොකරයි, නමුත් එය කිරීම පහසුය. ” [අවධාරණය එකතු කරන ලදි]
ස්වදේශීය එදිරිව වී.එම්
ස්වදේශීය බ්‍රව්සර් සහාය ("වේගවත් බව සහතික කර ඇත" කියවන්න)
දැන් අවසාන වශයෙන් මතයක් නොවන දෙයක්.
ඇත්තෙන්ම මෙහි එය හරියටම අනෙක් පැත්තයි. ඇත්ත වශයෙන්ම "ස්වදේශීය" කේතය C ++ වලින් ලිවිය හැකි නමුත් ජාවාස්ක්‍රිප්ට් එන්ජින් ලියා ඇත්තේ කුමක් ද?
ඇත්ත වශයෙන්ම, ජාවාස්ක්‍රිප්ට් එන්ජින් අද භාවිතා කරන ප්‍රශස්තිකරණයන්හි ඇත්තෙන්ම විශ්මය ජනකයි - සහ V8 පමණක් නොව, ස්පයිඩර් මොන්කි සහ චක්‍ර පවා මේ දිනවල බබළයි. JIT සම්පාදකයින් සමඟ කේතය විය හැකි තරම් දේශීය වනවා පමණක් නොව, සංඛ්‍යාත්මකව සම්පාදනය කරන ලද කේතයක කළ නොහැකි සරලව ක්රියාත්මක වන කාල ප්‍රශස්තිකරණ අවස්ථා ද ඇති බව මතක තබා ගන්න.
ජාවාස්ක්‍රිප්ට් මන්දගාමී යැයි මිනිසුන් සිතන විට, ඔවුන් සාමාන්‍යයෙන් අදහස් කරන්නේ ඩොම් වෙත ප්‍රවේශ වන ජාවාස්ක්‍රිප්ට් ය. DOM මන්දගාමී වේ. එය ස්වදේශිකය, C ++ වලින් ලියා ඇති නමුත් එය ක්රියාත්මක කිරීමට ඇති සංකීර්ණතාවය නිසා එය නිරය මෙන් මන්දගාමී වේ.
ඔබේ කොන්සෝලය විවෘත කර ලියන්න:
console.dir(document.createElement('div'));
සහ divDOM සමඟ සම්බන්ධ නොවූ හිස් මූලද්‍රව්‍යයක් කොපමණ ගුණාංග ප්‍රමාණයක් ක්රියාත්මක කළ යුතු දැයි බලන්න . මේවා “ස්වකීය ගුණාංග” එනම් පළමු මට්ටමේ ගුණාංග පමණි . මූලාකෘති දාමයෙන් උරුම වී නැත:
align, onwaiting, onvolumechange, ontimeupdate, onsuspend, onsubmit, onstalled, onshow, onselect, onseeking, onseeked, onscroll, onresize, onreset, onratechange, onprogress, onplaying, onplay, onpause, onmousewheel, onmouseup, onmouseover, onmouseout, onmousemove, onmouseleave, onmouseenter, onmousedown, onloadstart, onloadedmetadata, onloadeddata, onload, onkeyup, onkeypress, onkeydown, oninvalid, oninput, onfocus, onerror, ഒറ്റ oncontextmenu, onclose, onclick, onchange, oncanplaythrough, oncanplay, oncancel, onblur, onabort, spellcheck, isContentEditable, contenteditable, outerText, innerText, Accesskey, සැඟවුණු, webkitdropzone, draggable, tabIndex, හිස් තීරුවෙහි, පරිවර්තනය, lang, මාතෘකාව, childElementCount, lastElementChild,firstElementChild, children, nextElementSibling, previousElementSibling, onwheel, onwebkitfullscreenerror, onwebkitfullscreenchange, onselectstart, onearch, onpaste, oncut, oncopy, onbeforepaste, onbeforecut, onbeforecopy, webkitStroTTHTMT clientHeight, clientWidth, clientTop, clientLeft, offsetParent, offsetHeight, offsetWidth, offsetTop, offsetLeft, localName, prefix, namespaceURI, id, style, attributes, tagName, parentElement, textContent, baseURI, ownerDocument, nextSibling, lastSibling parentNode, nodeType, nodeValue, nodeNameoncopy, onbeforepaste, onbeforecut, onbeforecopy, webkitShadowRoot, දත්ත කට්ටලය, classList, className, externalHTML, internalHTML, scrollHeight, scrollWidth, scrollTop, scrollLeft, clientHeight, clientWidth, clientTop, offT off off off namespaceURI, id, style, attributes, tagName, parentElement, textContent, baseURI, ownerDocument, nextSibling, previousSibling, lastChild, firstChild, childNodes, parentNode, nodeType, nodeValue, nodeNameoncopy, onbeforepaste, onbeforecut, onbeforecopy, webkitShadowRoot, දත්ත කට්ටලය, classList, className, externalHTML, internalHTML, scrollHeight, scrollWidth, scrollTop, scrollLeft, clientHeight, clientWidth, clientTop, offT off off off namespaceURI, id, style, attributes, tagName, parentElement, textContent, baseURI, ownerDocument, nextSibling, previousSibling, lastChild, firstChild, childNodes, parentNode, nodeType, nodeValue, nodeNameparentElement, textContent, baseURI, ownerDocument, nextSibling, previousSibling, lastChild, firstChild, childNodes, parentNode, nodeType, nodeValue, nodeNameparentElement, textContent, baseURI, ownerDocument, nextSibling, previousSibling, lastChild, firstChild, childNodes, parentNode, nodeType, nodeValue, nodeName
ඒවායින් බොහොමයක් සැබවින්ම කැදැලි වස්තු වේ - divඔබේ බ්‍රව්සරයේ හිස් ස්වදේශිකයෙකුගේ දෙවන මට්ටමේ (තමන්ගේම) ගුණාංග බැලීමට, මෙම ෆෙඩලය බලන්න .
මම බැරෑරුම් ලෙස අදහස් කළේ, සෑම ඩිව් නෝඩයකම දේපල වෙනස් කිරීම? එය වැරැද්දක් ද? නෑ, එය හුදෙක් සිදුවීම් හසුරුවන්නෙකුගේ සම්ප්‍රදායික සිදුවීම් ආකෘති අනුවාදයක් වන අතර එය අන්තර්ගත ගුණාංග සහ IDL ගුණාංග යන දෙකම සඳහා සියලුම HTML අංගයන්ගෙන් සහය විය යුතුය ”[අවධාරණය එකතු කරන ලදි] HTML පිරිවිතරයේ 6.1.6.2 වගන්තියේ W3C විසින් - එය වටා කිසිදු මාර්ගයක් නොමැත.
මේ අතර, divප්රතික්රියා වල ව්යාජ DOM හි පළමු මට්ටමේ ගුණාංග මේවා වේ :
මුක්කු, _ හිමිකරු, _ලයිෆ් සයිකල් ස්ටේට්, _පෙන්ඩින්ප්‍රොප්ස්, _පෙන්ඩිං කැල්බැක්ස්, _පෙන්ඩිං ඕවර්
ටිකක් වෙනසක්, එහෙම නේද? ඇත්ත වශයෙන්ම මෙය JSON ( LIVE DEMO ) වෙත අනුක්‍රමික කර ඇති සමස්ත වස්තුවයි , මන්ද ඒයි ඔබට සැබවින්ම එය JSON වෙත අනුක්‍රමික කළ හැකි බැවින් එහි කිසිදු චක්‍රලේඛ සඳහනක් අඩංගු නොවේ - ස්වදේශික DOM ලෝකයේ සිතාගත නොහැකි දෙයක් ( එහිදී එය ව්‍යතිරේකයක් විසි කරයි ):
{
"props": {},
"_owner": null,
"_lifeCycleState": "UNMOUNTED",
"_pendingProps": null,
"_pendingCallbacks": null,
"_pendingOwner": null
}
ප්රතික්රියා දේශීය බ්‍රව්සරයට වඩා වේගවත් වීමට ප්රධාන හේතුව මෙයයි - එයට මෙම අවුල ක්රියාත්මක කිරීමට අවශ්ය නැති නිසා .
බලන්න ස්ටීවන් Luscher විසින් මෙම ඉදිරිපත් සී ලියා දේශීය DOM ++ හෝ JavaScript සම්පූර්ණයෙන්ම ලියා ව්යාජ DOM: වේගවත් දේ බලන්න. එය ඉතා සාධාරණ හා විනෝදාත්මක ඉදිරිපත් කිරීමකි.
යාවත්කාලීන කිරීම: අනාගත අනුවාද වල Ember.js පරිපූර්ණත්වය වැඩි දියුණු කිරීම සඳහා ප්රතික්රියා මගින් දැඩි ලෙස දේවානුභාවයෙන් අථත්ය DOM භාවිතා කරනු ඇත. බලන්න: 2014 නොවැම්බර් 15 වන දින ටොරොන්ටෝහි එම්බර්ගාර්ටන් සම්මන්ත්‍රණයෙන් ස්ටෙෆාන් පෙන්ර් විසින් එම්බර් කතාවේ අනාගතය .
සාරාංශගත කිරීම සඳහා: සැකිලි, දත්ත බන්ධන හෝ අභිරුචි අංග වැනි වෙබ් සංරචක වල විශේෂාංග ප්රතික්රියා වලට වඩා බොහෝ වාසි ඇත, නමුත් ලේඛන වස්තු ආකෘතිය සැලකිය යුතු ලෙස සරල වන තෙක් කාර්ය සාධනය ඒවායින් එකක් නොවනු ඇත.
යාවත්කාලීන කරන්න
මා මෙම පිළිතුරු පළ කර මාස දෙකකට පසු මෙහි අදාළ ප්‍රවෘත්ති කිහිපයක් විය. ලෙස මම ට්විටර් ලියා ඇත , මේ වන lastest අනුවාදය Atom JavaScript දී GitHub විසින් ලියන පෙළ සකසනය ෆේස්බුක් වඩා හොඳ කාර්ය සාධනය ලබා ගැනීමට ක්රියාත්මක වෙන්න කුබුන්ටු වුවත් විකිපීඩියා, නිදහස් විශ්වකෝෂය අනුව "Atom ෙකෝමියම් මත පදනම් වේ හා C ++" ලියා එය සම්පූර්න පාලනය කර එසේ ස්වදේශික C ++ DOM ක්රියාත්මක කිරීම ( පරමාණුවේ න්‍යෂ්ටිය බලන්න ) සහ වෙබ් සංරචක තමන්ගේම වෙබ් බ්‍රව්සරයක් සමඟ නැව්ගත කරන බැවින් එයට සහාය ඇති බවට සහතික වේ. වෙබ් යෙදුම් සඳහා සාමාන්‍යයෙන් ලබාගත නොහැකි වෙනත් ආකාරයේ ප්‍රශස්තිකරණයක් භාවිතා කළ හැකි සැබෑ ලෝක ව්‍යාපෘතියකට එය ඉතා මෑත උදාහරණයකි. එහෙත් එය ජාවාස්ක්‍රිප්ට් හි ලියා ඇති ප්රතික්රියා භාවිතා කිරීමට තෝරාගෙන ඇත. ආරම්භ කිරීම සඳහා ප්රතික්රියා සමඟ ගොඩනගා නැත, එබැවින් එය සුළුපටු වෙනසක් නොවේ.
යාවත්කාලීන 2
නැත ටොඩ් පාකර් විසින් සිත්ගන්නා සංසන්දනය භාවිතා WebPagetest ක කාර්ය සාධනය සන්සන්දනය කිරීම TodoMVC ෙකෝණික, ආධාරක, Ember, පොලිමර්, CanJS, YUI, පිලිමළුන් පිටුදැකීම, ක්රියාත්මක වෙන්න සහ Shoestring ලියා උදාහරණ. මම මෙතෙක් දැක ඇති වඩාත්ම වෛෂයික සංසන්දනය මෙයයි. මෙහි ඇති වැදගත්කම නම්, අදාළ සියලු උදාහරණ එම සියලු රාමු වල ප්‍රවීණයන් විසින් ලියන ලද්දක් වන අතර, ඒවා සියල්ලම GitHub වෙතින් ලබා ගත හැකි අතර සමහර කේත වේගයෙන් ධාවනය කිරීමට ප්‍රශස්තිකරණය කළ හැකි යැයි සිතන ඕනෑම කෙනෙකුට එය වැඩිදියුණු කළ හැකිය.
යාවත්කාලීන 3
අනාගත අනුවාද වල Ember.js හි මෙහි සාකච්ඡා කර ඇති ප්රතික්රියා වල විශේෂාංග ගණනාවක් ඇතුළත් වනු ඇත (අතථ්‍ය DOM සහ ඒක දිශානුගත දත්ත බන්ධනය ඇතුළුව, කිහිපයක් නම් කිරීම සඳහා) එයින් අදහස් වන්නේ ප්රතික්රියා වලින් ආරම්භ වූ අදහස් දැනටමත් වෙනත් රාමුවලට සංක්‍රමණය වී ඇති බවයි. බලන්න: එම්බර් 2.0 ආර්එෆ්සී වෙත යන මාර්ගය - ටොම් ඩේල්ගේ ඉල්ලීමෙහි සිත්ගන්නාසුලු සාකච්ඡාව (ආරම්භක දිනය: 2014-12-03): “එම්බර් 2.0 හි අපි“ අතථ්‍ය ඩොම් ”සහ දත්ත ප්‍රවාහ ආකෘතියක් අනුගමනය කරන්නෙමු. ප්රතික්රියා වලින් හොඳම අදහස් සහ සංරචක අතර සන්නිවේදනය සරල කරයි.
එසේම, Angular.js 2.0 මෙහි සාකච්ඡා කර ඇති සංකල්ප රාශියක් ක්රියාත්මක කරයි.
යාවත්කාලීන කිරීම 4
ඉග්වේ කළුගේ මෙම ප්‍රකාශයට පිළිතුරු දීමට මට කරුණු කිහිපයක් විස්තර කළ යුතුය.
"ප්රතික්රියා අවසානයේ දී ජාවාස්ක්‍රිප්ට් සමඟ ප්රතික්රියා අඩු කරන විට ප්රතික්රියා (ජේඑස්එක්ස් හෝ සම්පාදන ප්‍රතිදානය) සරල ජාවාස්ක්‍රිප්ට් සමඟ සංසන්දනය කිරීම බුද්ධිමත් නොවේ. පහසුව හැර වෙනත් ප්රශ්නයක් ඇති අංගය සලකා බැලීමේදී විශේෂ ප්රතිලාභ එකතු නොකරයි. (සම්පූර්ණ අදහස මෙතැනින් )
එය ප්‍රමාණවත් තරම් පැහැදිලි නැතිනම්, මගේ පිළිතුරේ කොටසක් ලෙස මම ස්වදේශික DOM මත සෘජුවම ක්රියාත්මක වීමේ කාර්ය සාධනය සංසන්දනය කරමි (බ්‍රව්සරයේ ධාරක වස්තු ලෙස ක්රියාත්මක කර ඇත) එදිරිව. ප්රතික්රියා වල ව්යාජ / අථත්ය DOM (ජාවාස්ක්‍රිප්ට් හි ක්රියාත්මක කර ඇත). කිරීමට මම උත්සාහ කළ අවස්ථාවේදී JavaScript ක්රියාත්මක අථත්ය DOM බව ය හැකි සී ක්රියාත්මක සැබෑ DOM අපට හැකිවූයේ ++ හා නොවන ප්රතිචාර දක්වයි බව JavaScript (එය පටන් පැහැදිලිවම තේරුමක් නොමැති වනු ඇති, විශේෂඥයින් හැකි වේ JavaScript ලියා). මගේ අදහස වූයේ "ස්වදේශීය" සී ++ කේතය සෑම විටම "ස්වදේශීය නොවන" ජාවාස්ක්‍රිප්ට් වලට වඩා වේගවත් බව සහතික නොවේ. එම කරුණ නිදර්ශනය කිරීම සඳහා ප්රතික්රියා භාවිතා කිරීම උදාහරණයක් පමණි.
නමුත් මෙම ප්‍රකාශය සිත්ගන්නා කාරණයක් ස්පර්ශ කළේය. එක් අතකින් ඔබට කිසිදු රාමුවක් (ප්රතික්රියා, කෝණික හෝ jQuery) අවශ්ය නොවන බව සත්‍යයකි (කාර්ය සාධනය, අතේ ගෙන යා හැකි, විශේෂාංග වැනි) ඔබට සෑම විටම රාමුව ඔබ වෙනුවෙන් කරන දේ ප්‍රතිනිර්මාණය කර රෝදය ප්‍රතිනිර්මාණය කළ හැකිය - එසේ නම් ඔබට පිරිවැය සාධාරණීකරණය කළ හැකිය, එනම්.
- ඒත්, ඩේව් ස්මිත් අවසරයෙන් හි පවසන ආකාරයට වෙබ් රාමුවක් කාර්ය සාධන සාපේක්ෂව කාරණය මතක් කරන්නේ කෙසේද? "වෙබ් රාමුව දෙකක් සංසන්දනය කරන විට, ප්රශ්නයක් නොවේ: හැකි මගේ යෙදුම ප්රශ්නය වන්නේ රාමුව X. සමග වේගවත් වෙනවා ඇත මගේ යෙදුම රාමුව සමග වේගවත් වෙනවා X."
දී භාවිතා නොකරන ලෙස jQuery සමහර ආනුභවික තාක්ෂණික හේතු මොනවාද: මගේ 2011 පිළිතුරු මම එය සඟවන්න වැනි පුස්තකාල තොරව එහා මෙහා ගෙන යා හැකි DOM-හැසිරවීම කේතය ලියන්න බැරි කමක් නැහැ, නමුත් ජනතාව එසේ කලාතුරකින් බව, ඒ හා සමාන ප්රශ්නය පැහැදිලි.
ක්‍රමලේඛන භාෂා, පුස්තකාල හෝ රාමු භාවිතා කරන විට, මිනිසුන් වඩාත් පහසු හෝ මුග්ධ දේවල් කිරීමට පෙළඹේ, පරිපූර්ණ නමුත් අපහසු ඒවා නොවේ. හොඳ රාමු වල සැබෑ වටිනාකම වෙනත් ආකාරයකින් කිරීමට අපහසු දේ පහසු කිරීම - සහ රහස වන්නේ නිවැරදි දේ පහසු කිරීමයි. මෙහි ප්‍රති result ලය වන්නේ ලැම්බඩා කැල්කියුලස් හෝ වඩාත් ප්‍රාථමික ටියුරින් යන්ත්‍රය වැනි සරලම බලය තවමත් ඔබ සතුව තිබීමයි, නමුත් සමහර සංකල්පවල සාපේක්ෂ ප්‍රකාශනය යන්නෙන් අදහස් වන්නේ එම සංකල්ප වඩාත් පහසුවෙන් හෝ කිසිසේත්ම ප්‍රකාශ වීමට නැඹුරු වන බවයි. නිවැරදි විසඳුම් කළ හැකි පමණක් නොව පුළුල් ලෙස ක්රියාත්මක වේ.
යාවත්කාලීන 5
ප්රතික්රියා + කාර්ය සාධනය =? පෝල් ලුවිස් විසින් 2015 ජූලි මාසයේ පළ කරන ලද ලිපියක් මඟින් වැනිලා ජාවාස්ක්‍රිප්ට් වලට වඩා ප්රතික්රියා මන්දගාමී වන අතර එය අසීමිත ෆ්ලිකර් පින්තූර ලැයිස්තුවක් සඳහා අතින් ලියන ලද අතර එය ජංගම දුරකථනයේ විශේෂයෙන් වැදගත් වේ. මෙම උදාහරණයෙන් පෙන්නුම් කරන්නේ සෑම කෙනෙකුම නිශ්චිත භාවිත අවස්ථා සහ නිශ්චිත ඉලක්ක වේදිකා සහ උපාංග සඳහා සෑම විටම කාර්ය සාධනය පරීක්ෂා කළ යුතු බවයි.
ස්තුති කෙවින් Lozandier සඳහා මගේ අවධානයට යොමු එය ගෙන ඒම .