আপডেট: এই উত্তরটি বেশ জনপ্রিয় বলে মনে হচ্ছে তাই আমি এটিকে কিছুটা সাফ করার জন্য কিছুটা সময় নিয়েছি, কিছু নতুন তথ্য যুক্ত করেছি এবং এমন কিছু বিষয় পরিষ্কার করেছিলাম যা আমি ভেবেছিলাম যে যথেষ্ট পরিষ্কার ছিল না। আপনার যদি মনে হয় অন্য কোনও কিছুর ব্যাখ্যা বা আপডেট দরকার needs
আপনার বেশিরভাগ উদ্বেগ সত্যই মতামত এবং ব্যক্তিগত পছন্দের বিষয় তবে আমি যথাসম্ভব উদ্দেশ্যমূলকভাবে উত্তর দেওয়ার চেষ্টা করব:
নেটিভ বনাম সংকলিত
ভ্যানিলা জাভাস্ক্রিপ্ট জাভাস্ক্রিপ্ট লিখুন, সিএসএসে সিএসএস লিখুন, এইচটিএমএল লিখুন।
দিনে ফিরে সেখানে গরম বিতর্ক কিনা এক লেখা উচিত ছিল নেটিভ অথবা হাত পরিষদের C- এর মতো একটি উচ্চ স্তরের ভাষা ব্যবহার কম্পাইলার আপনার জন্য পরিষদের কোড জেনারেট করতে। এর আগেও লোকেরা এসেম্বলারের উপর আস্থা রাখতে অস্বীকার করেছিল এবং হাতে হাতে দেশীয় মেশিন কোড লিখতে পছন্দ করেছিল ( এবং আমি ঠাট্টা করছি না )।
এদিকে, আজ যারা এইচটিএমএল লিখতে অনেক আছে Haml বা জেড মধ্যে, সিএসএস Sass বা কম এবং জাভাস্ক্রিপ্ট CoffeeScript বা টাইপ করা বিষয় । এটা ওইখানে. এটা কাজ করে। কিছু লোক এটিকে পছন্দ করে, কেউ তা পছন্দ করে না।
বিন্দুতে মৌলিকভাবে ভুল নেই যে আছে না ভ্যানিলা জাভাস্ক্রিপ্ট, সিএসএস এবং HTML HTML এ সিএসএস জাভাস্ক্রিপ্ট লেখা। এটি সত্যিই পছন্দের বিষয়।
অভ্যন্তরীণ বনাম বাহ্যিক ডিএসএল
এর পরিবর্তে শ্যাডো ডোম প্রতিক্রিয়া ব্যবহার করে স্টাইল এনক্যাপসুলেশনটির এটি রয়েছে, যার জন্য জাভাস্ক্রিপ্টে সিএসএস লেখার প্রয়োজন। সুন্দর না.
খুব সুন্দর বা না, এটি অবশ্যই প্রকাশিত। জাভাস্ক্রিপ্ট একটি খুব শক্তিশালী ভাষা, সিএসএসের চেয়ে অনেক বেশি শক্তিশালী (এমনকি সিএসএস প্রিপ্রোসেসরগুলি সহ)। আপনি এই ধরণের জিনিসের জন্য অভ্যন্তরীণ বা বাহ্যিক ডিএসএল পছন্দ করেন কিনা তা নির্ভর করে It আবার, পছন্দের একটি বিষয়।
(দ্রষ্টব্য: আমি প্রতিক্রিয়াটির ইনলাইন শৈলীর কথা বলছিলাম যা মূল প্রশ্নে উল্লেখ করা হয়েছিল))
ডিএসএল এর প্রকার - ব্যাখ্যা
আপডেট: আমার উত্তরটি লেখার পরে কিছু সময় পড়া আমার মনে হয় এখানে আমার অর্থ কী তা বোঝানোর দরকার আছে। ডিএসএল একটি ডোমেন-নির্দিষ্ট ভাষা এবং এটি অভ্যন্তরীণ হতে পারে (জাভাস্ক্রিপ্টের মতো হোস্ট ভাষার সিনট্যাক্স ব্যবহার করে - উদাহরণস্বরূপ জেএসএক্স ছাড়াই প্রতিক্রিয়া দেখান বা উপরে উল্লিখিত প্রতিক্রিয়াতে ইনলাইন শৈলীর মতো) বা এটি বাহ্যিক হতে পারে (একটি ভিন্ন বাক্য গঠন ব্যবহার করে) হোস্ট ভাষার তুলনায় - উদাহরণস্বরূপ জাভাস্ক্রিপ্টের অভ্যন্তরে সিএসএস (একটি বাহ্যিক ডিএসএল) ইনলাইন করা হবে।
এটি বিভ্রান্তিকর হতে পারে কারণ কিছু সাহিত্যিক এই জাতীয় ডিএসএল বর্ণনা করতে "অভ্যন্তরীণ" এবং "বাহ্যিক" এর চেয়ে পৃথক পদ ব্যবহার করে। কখনও কখনও "অভ্যন্তরীণ" পরিবর্তে "এম্বেড" ব্যবহৃত হয় তবে "এম্বেড" শব্দের অর্থ বিভিন্ন জিনিস হতে পারে - উদাহরণস্বরূপ লুয়াকে "লুয়া: একটি এক্সটেনসিবল এম্বেডেড ভাষা" হিসাবে বর্ণনা করা হয়েছে যেখানে এম্বেড এম্বেডযুক্ত (অভ্যন্তরীণ) ডিএসএল-এর সাথে কিছুই করার নেই কোন অর্থে এটি একেবারে বিপরীত - একটি বাহ্যিক ডিএসএল) তবে এর অর্থ এটি এটি একই অর্থে এম্বেড করা হয়েছে যে, বলুন, এসকিউএলাইট একটি এম্বেডেড ডাটাবেস। এমন কি ইলুয়া আছে যেখানে "ই" এর অর্থ তৃতীয় অর্থে "এম্বেড করা" - এটি এমবেডড সিস্টেমগুলির জন্য বোঝানো হয়! এ কারণেই আমি "এম্বেডড ডিএসএল" শব্দটি ব্যবহার করতে পছন্দ করি না কারণ ইলুয়ার মতো জিনিসগুলি "ডিএসএল" হতে পারে যা "এম্বেডড ডিএসএল" না হওয়ার পরেও দুটি ভিন্ন ইন্দ্রিয়তে "এম্বেড" হয়!
কিছু খারাপ করার জন্য কিছু প্রকল্পগুলি আরও বেশি বিভ্রান্তিকে মিশ্রণে প্রবর্তন করে। যেমন। ফ্ল্যাটিরনের টেম্পলেটগুলিকে "ডিএসএল-মুক্ত" হিসাবে বর্ণনা করা হয় যদিও বাস্তবে এটি সিন্ট্যাক্সের মতো কোনও অভ্যন্তরীণ ডিএসএলের কেবলমাত্র নিখুঁত উদাহরণ: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>
প্রথম উদাহরণটিতে প্রশ্নটিতে যা বর্ণিত হয়েছে তা ব্যবহার করে: "জাভাস্ক্রিপ্টে সিএসএস লিখছি pretty সুন্দর নয়।" দ্বিতীয় উদাহরণটি সাস ব্যবহার করে। আমি সম্মত হয়েছি যে সিএসএস লিখতে জাভাস্ক্রিপ্ট ব্যবহার করা সুন্দর নাও হতে পারে ("বেশ কয়েকটি" সংজ্ঞায়নের জন্য) তবে এটি করার একটি সুবিধা রয়েছে।
আমার সাসে ভেরিয়েবল এবং ফাংশন থাকতে পারে তবে সেগুলি কি নমনীয়ভাবে স্কোপড বা গতিশীলভাবে বাদ দেওয়া যায়? সেগুলি কি স্থিতিশীল বা গতিশীল টাইপ করা আছে? শক্তভাবে নাকি দুর্বল? সংখ্যার প্রকার সম্পর্কে কী? টাইপ জাল? কোন মান সত্যবাদী এবং কোনটি মিথ্যা? আমার কি উচ্চতর অর্ডার ফাংশন থাকতে পারে? Recursion? লেজ কল? লেক্সিকাল ক্লোজার? এগুলি কি সাধারণ ক্রমে বা প্রয়োগমূলক ক্রমে মূল্যায়ন করা হয়? অলস বা আগ্রহী মূল্যায়ন আছে? মান দ্বারা বা রেফারেন্স দ্বারা ফাংশন যুক্তি যুক্ত হয়? তারা কি পরিবর্তনযোগ্য? অপরিবর্তনীয়? জেদি? বস্তুর কী হবে? ক্লাস? এগুলির নমুনা? উত্তরাধিকার?
এগুলি তুচ্ছ প্রশ্ন নয় এবং তবুও আমি স্যাস বা কম কোড বুঝতে চাইলে তাদের উত্তরগুলি জানতে হবে। আমি জাভাস্ক্রিপ্টের জন্য সেই উত্তরগুলি ইতিমধ্যে জানি তাই এর অর্থ হল যে আমি ইতিমধ্যে প্রতিটি অভ্যন্তরীণ ডিএসএল বুঝতে পারি (প্রতিক্রিয়ায় ইনলাইন স্টাইলগুলির মতো) সেই স্তরের উপর যদি আমি প্রতিক্রিয়া ব্যবহার করি তবে আমাকে সেগুলির উত্তরগুলির একটি মাত্র সেট জানতে হবে (এবং অনেকগুলি অনুরূপ ) প্রশ্নগুলি, যখন আমি উদাহরণস্বরূপ ব্যবহার করি। সাস এবং হ্যান্ডলবারস তখন আমাকে সেই উত্তরগুলির তিনটি সেট জানতে হবে এবং তাদের প্রভাবগুলি বুঝতে হবে।
এটি বলার অপেক্ষা রাখে না যে একটি উপায়ে বা অন্যটি সর্বদা ভাল but তবে প্রতিবার আপনি যখন অন্য ভাষার মিশ্রণের সাথে পরিচয় করিয়ে দেন তারপরে আপনি কিছু মূল্য দিতে পারেন যা প্রথম নজরে যেমন স্পষ্ট নাও হতে পারে, এবং এই দামটি জটিলতা is
আমি আশা করি আমি মূলত যা বোঝাতে চেয়েছিলাম তা স্পষ্ট করে বললাম।
ডেটা বাইন্ডিং
দ্বিমুখী বাঁধাই
এটি একটি সত্যই আকর্ষণীয় বিষয় এবং বাস্তবে এটিও একটি পছন্দের বিষয়। দ্বি-মুখী সর্বদা একমুখী থেকে ভাল হয় না। আপনি কীভাবে আপনার অ্যাপ্লিকেশনটিতে পরিবর্তনীয় স্থির মডেল করতে চান তা একটি প্রশ্ন। আমি সবসময় দ্বিমুখী বাইন্ডিংগুলি কার্যকরী প্রোগ্রামিংয়ের নীতিগুলির বিপরীতে একটি ধারণা হিসাবে দেখেছিলাম তবে কার্যকরী প্রোগ্রামিং কেবলমাত্র দৃষ্টান্ত নয় যা কিছু কাজ করে, কিছু লোক এই জাতীয় আচরণ পছন্দ করে এবং উভয় পদ্ধতির অনুশীলনে বেশ ভাল কাজ করে বলে মনে হয়। আপনি যদি প্রতিক্রিয়াতে রাজ্যের মডেলিং সম্পর্কিত ডিজাইনের সিদ্ধান্তের বিশদ সম্পর্কে আগ্রহী হন তবে পিট হান্ট (প্রশ্নের সাথে যুক্ত) এবং টম ওচিনো এবং জর্ডান ওয়াল্কের আলোচনার বিষয়ে আলোচনা করুন যারা খুব সুন্দরভাবে ব্যাখ্যা করেছেন আমার মতামত.
আপডেট: পিট হান্টের আরও একটি আলোচনা দেখুন: অনুমানযোগ্য হতে হবে, সঠিক নয়: কার্যকরী ডিওএম প্রোগ্রামিং ।
আপডেট 2: এটি লক্ষ্য করার মতো যে অনেক বিকাশকারী দ্বি-নির্দেশমূলক ডেটা প্রবাহ বা দ্বিমুখী বাইন্ডিংয়ের বিরুদ্ধে তর্ক করছেন , কেউ কেউ এটিকে বিরোধী-নিদর্শনও বলে। উদাহরণস্বরূপ ধরুন যে ফ্লাক্স অ্যাপ্লিকেশন আর্কিটেকচারটি এমভিসি মডেলকে স্পষ্টভাবে এড়িয়ে চলে (এটি বৃহত ফেসবুক এবং ইনস্টাগ্রাম অ্যাপ্লিকেশনগুলির জন্য স্কেল করা কঠিন বলে প্রমাণিত হয়েছিল) কঠোরভাবে একমুখী ডেটা প্রবাহের পক্ষে ( হ্যাকার ওয়ে দেখুন: ফেসবুক আলোচনায় পুনর্বিবেচনা ওয়েব অ্যাপ্লিকেশন ডেভলপমেন্ট দ্বারা টম ওচিনো, জিং চেন এবং পিট হান্ট একটি ভাল পরিচয়ের জন্য)। এছাড়াও, অ্যাঙ্গুলারজেএসের বিরুদ্ধে প্রচুর সমালোচনা (সর্বাধিক জনপ্রিয় ওয়েব ফ্রেমওয়ার্ক যা এমভিসি মডেলের উপর ভিত্তি করে আলগাভাবে দ্বিমুখী ডেটা বাঁধাইয়ের জন্য পরিচিত) সেই দ্বিদ্বায়ক ডেটা প্রবাহের বিরুদ্ধে যুক্তিগুলি অন্তর্ভুক্ত করে দেখুন:
আপডেট 3: আরও একটি আকর্ষণীয় নিবন্ধ যা উপরে বর্ণিত কিছু বিষয় সুন্দরভাবে ব্যাখ্যা করেছে তা হ'ল রিঅ্যাকটিজেএস-এর ফ্লাক্স ডিকনস্ট্রাকচারিং - রিফ্লাকজেএস-র লেখক মিকেল ব্রাসম্যান দ্বারা র্যাক্টজেএস-এর সাথে এমভিসি ব্যবহার না করা (ফ্লাক্স দ্বারা অনুপ্রাণিত একমুখী ডেটা ফ্লো অ্যাপ্লিকেশন আর্কিটেকচারের জন্য একটি সাধারণ গ্রন্থাগার)।
আপডেট 4: এমবার.জেএস বর্তমানে দ্বি-মুখী ডেটা বাঁধাই থেকে দূরে চলেছে এবং ভবিষ্যতের সংস্করণগুলিতে এটি ডিফল্টভাবে একমুখী হবে। দেখুন: নভেম্বর 15, 2014 এ টরন্টোর আম্বারগার্টেন সিম্পোজিয়াম থেকে স্টিফেন পেনারের স্টিফান পেনার দ্বারা ভবিষ্যতের অ্যাম্বারের আলাপ।
আপডেট 5: এটিও দেখুন: রোড টু এম্বার ২.০ আরএফসি - টম ডেলের টান অনুরোধে আকর্ষণীয় আলোচনা :
"যখন আমরা আসল টেম্প্লেটিং স্তরটি ডিজাইন করলাম, তখন আমরা বুঝতে পেরেছিলাম যে সমস্ত ডেটা বাইন্ডিংগুলি দ্বি-উপায়ে তৈরি করা খুব ক্ষতিকারক নয়: আপনি যদি দ্বি-মুখী বাঁধাই সেট না করেন, তবে এটি একটি ডি-ফ্যাক্টো ওয়ান-ওয়ে বাইন্ডিং!
আমরা তখন থেকে উপলব্ধি করেছি (প্রতিক্রিয়াতে আমাদের বন্ধুদের কাছ থেকে কিছু সহায়তায়) যে উপাদানগুলি তাদের বাচ্চাদের ডেটার বাহিরের পরিবর্তনের জন্য সতর্ক না হয়ে তথ্য সরবরাহ করতে সক্ষম হতে চায়।
উপরন্তু, উপাদান মধ্যে যোগাযোগ প্রায়ই সবচেয়ে স্বাভাবিকভাবেই ইভেন্ট বা callbacks হিসেবে প্রকাশ করা হয় । এটি অ্যাম্বারে সম্ভব, তবে দ্বিমুখী ডেটা বাইন্ডিংয়ের আধিপত্য প্রায়শই লোককে যোগাযোগের চ্যানেল হিসাবে দ্বি-মুখী বাইন্ডিংগুলি ব্যবহার করার পথে নিয়ে যায় । অভিজ্ঞ জ্বলন্ত আগুন ডেভেলপারদের না (সাধারণত) এই ভুল করা, কিন্তু এটা করতে একটি সহজ এক। " [জোর যোগ]
নেটিভ বনাম ভিএম
নেটিভ ব্রাউজার সমর্থন ("দ্রুত হওয়ার গ্যারান্টিযুক্ত" পড়ুন)
এখন অবশেষে এমন কিছু যা মতের বিষয় নয়।
প্রকৃতপক্ষে এখানে এটি প্রায় অন্যান্য উপায় exactly অবশ্যই "নেটিভ" কোডটি সি ++ তে লেখা যেতে পারে তবে জাভাস্ক্রিপ্ট ইঞ্জিনগুলি কী লেখা আছে বলে আপনি মনে করেন?
প্রকৃতপক্ষে জাভাস্ক্রিপ্ট ইঞ্জিনগুলি আজ যে অপ্টিমাইজেশানগুলি ব্যবহার করে সেগুলি সত্যই আশ্চর্যজনক - এবং কেবলমাত্র ভি 8 নয়, স্পাইডারমনকি এবং এমনকি চক্র এই দিনগুলিতে জ্বলজ্বল করে। এবং মনে রাখবেন যে জেআইটি সংকলকগুলির সাথে কোডটি কেবল সম্ভবত দেশীয় নয় যতটা সম্ভবত এটি হতে পারে তবে রান টাইম অপ্টিমাইজেশনের সুযোগগুলিও রয়েছে যা কোনও স্ট্যাটিকালি সংকলিত কোডে করা অসম্ভব।
লোকেরা যখন মনে করে যে জাভাস্ক্রিপ্টটি ধীর, তখন তাদের সাধারণত জাভা স্ক্রিপ্টের অর্থ ডিওএম অ্যাক্সেস করে। DOM ধীর। এটি নেটিভ, সি ++ তে লিখিত এবং তবুও এটি বাস্তবায়িত জটিলতার কারণে এটি নরকের মতো ধীর।
আপনার কনসোলটি খুলুন এবং লিখুন:
console.dir(document.createElement('div'));
এবং দেখুন divযে কোনও খালি উপাদান যা ডিওমের সাথে সংযুক্ত নয় সেগুলি কতগুলি সম্পত্তি প্রয়োগ করতে হয়। এগুলি কেবলমাত্র প্রথম স্তরের বৈশিষ্ট্য যা "নিজস্ব সম্পত্তি" অর্থাৎ। প্রোটোটাইপ চেইন থেকে উত্তরাধিকার সূত্রে প্রাপ্ত নয়:
অন্লাইটিং, অনভলিউমচেঞ্জ, অনটাইমআপডেট, অনসপেন্ড, অনসেমিট, অনস্টলড, অনশো, অনসलेक्ट, অনসাইকিং, অনসেলক, অনস্ক্রোল, অনস্রাইজ, অনসেট, অনরাইজেশন, অনগ্রস, অনপ্লে, ওপ্লে, অনপস, ওনমাউস, অনমাউজ, অনমোস onmouseenter, onmousedown, onloadstart, onloadedmetadata, onloadeddata, onload, onkeyup, onkeypress, onkeydown, oninDP, oninput, onfocus, onerror, onend, onemptied, ondration परिवर्तन, onroid, ondragstart, ondragc, ongd oncd অনকেক্সটেমেনু, অনক্লোজ, অনক্লিক, অনঞ্চল, অনক্লেপ্লেথ্রু, অনক্লেপ্লে, অনক্যান্সেল, অনব্লুর, অনাবোর্ট, স্পেলচেক, আইস কনটেন্টেডেবল, কন্টেন্টএডেবল, আউটটারটেক্সট, ইনরটেক্সট, অ্যাক্সেসকি, লুকানো, ওয়েবকিট্রোপজোন, ড্রাগগ্যাক্ট, লিংক, শিথিল, শিশু শিরোনাম, শিশুফার্স্টএলমেন্টচিল্ড, বাচ্চারা, নেক্সটএলমেন্টসিলিং, পূর্ববর্তী এলিটসিলিং, ওনওয়েল, অন্বেকিটফ্লাসস্ক্রিনারি, অন্বেবকিটফ্লাসস্ক্রিনচ, অন্বেষণকার্ট, অনসার্ক, অনপ্যাসট, অনকপ, স্ক্রিন, স্ক্রোল, স্ক্র্যাচ, HTML, ক্লাসহিট, HTML ক্লায়েন্টহাইট, ক্লায়েন্টউইথ, ক্লায়েন্টটপ, ক্লায়েন্ট লেফট, অফসেটপ্যারেন্ট, অফসেটহাইট, অফসেটউইথ, অফসেটপোপ, অফসেট লেফট, লোকালনেম, প্রিফিক্স, নেমস্পেসুরি, আইডি, স্টাইল, অ্যাট্রিবিউটস, ট্যাগনাম, প্যারেন্টিলেশন, টেক্সট কনটেন্ট, বেসুরি, ওপ্রেসক্লিং, পূর্ববর্তী শিশু প্যারেন্টনোড, নোডটাইপ, নোডভ্যালু, নোডনামঅনকপি, অনফরোপস্টে, অনফরোস্টকট, অনফরোস্টকপি, ওয়েবকিট শ্যাডরোট, ডাটাসেট, ক্লাসলিস্ট, ক্লাসনেম, আউটআর এইচটিএমএল, স্ক্রোলহাইট, স্ক্রোলউইথ, স্ক্রোলটপ, স্ক্রোলফিট, ক্লায়েন্টহাইট, ক্লায়েন্টউইট অফসেট, অফসেট অফসেট, অফসেট অফসেট, অফসেটসেট নেমস্পেসুরি, আইডি, শৈলী, বৈশিষ্ট্য, ট্যাগনাম, প্যারেন্টএলমেন্ট, টেক্সট কনটেন্ট, বেসুরি, মালিকের ডকুমেন্ট, নেক্সটসিলিং, পূর্ববর্তী শিবলিং, লাস্টচিল্ড, ফার্স্টচাইল্ড, চাইল্ডনডস, প্যারেন্টনোড, নোডটাইপ, নোডভ্যালুঅনকপি, অনফরোপস্টে, অনফরোস্টকট, অনফরোস্টকপি, ওয়েবকিট শ্যাডরোট, ডাটাসেট, ক্লাসলিস্ট, ক্লাসনেম, আউটআর এইচটিএমএল, স্ক্রোলহাইট, স্ক্রোলউইথ, স্ক্রোলটপ, স্ক্রোলফিট, ক্লায়েন্টহাইট, ক্লায়েন্টউইট অফসেট, অফসেট অফসেট, অফসেট অফসেট, অফসেটসেট নেমস্পেসুরি, আইডি, শৈলী, বৈশিষ্ট্য, ট্যাগনাম, প্যারেন্টএলমেন্ট, টেক্সট কনটেন্ট, বেসুরি, মালিকের ডকুমেন্ট, নেক্সটসিলিং, পূর্ববর্তী শিবলিং, লাস্টচিল্ড, ফার্স্টচাইল্ড, চাইল্ডনডস, প্যারেন্টনোড, নোডটাইপ, নোডভ্যালুপ্যারেন্টএলমেন্ট, টেক্সট কনটেন্ট, বেসুরি, মালিকডোকমেন্ট, নেক্সটসিলিং, পূর্ববর্তী শিবলিং, লাস্টচাইল্ড, ফার্স্টচিল্ড, চাইল্ডনোডস, প্যারেন্টনোড, নোডটাইপ, নোডভ্যালু, নোডনামপ্যারেন্টএলমেন্ট, টেক্সট কনটেন্ট, বেসুরি, মালিকডোকমেন্ট, নেক্সটসিলিং, পূর্ববর্তী শিবলিং, লাস্টচাইল্ড, ফার্স্টচিল্ড, চাইল্ডনোডস, প্যারেন্টনোড, নোডটাইপ, নোডভ্যালু, নোডনাম
তাদের মধ্যে অনেকগুলি আসলে নেস্টেড অবজেক্টস - divআপনার ব্রাউজারে খালি নেটিভির দ্বিতীয় স্তরের (নিজস্ব) বৈশিষ্ট্যগুলি দেখতে, এই ঝাঁকুনিটি দেখুন ।
আমি গুরুত্ব সহকারে বলতে চাই, প্রতিটি একক ডিভ নোডে অনভলিউমচেঞ্জ সম্পত্তি? এটা কি ভুল? না, এটা শুধু একটা উত্তরাধিকার করে DOM শ্রেনী 0 ঐতিহ্যগত ঘটনা মডেল ইভেন্ট হ্যান্ডলার এক সংস্করণ "যে আবশ্যক সমর্থিত হতে সব HTML উপাদানগুলি দ্বারা উভয় বিষয়বস্তু বৈশিষ্ট্যাবলী এবং IDL বৈশিষ্ট্যাবলী" এ [জোর যোগ] অনুচ্ছেদ 6.1.6.2 এইচটিএমএল বৈশিষ্ট ডাব্লু 3 সি দ্বারা - এটির কাছাকাছি কোনও উপায় নেই।
এদিকে, এগুলি divপ্রতিক্রিয়াতে একটি জাল-ডোমের প্রথম স্তরের বৈশিষ্ট্য :
প্রপস, _ মালিক, _লাইফাইকাইলস্টেট, _পেন্ডিংপপস, _পেন্ডিংক্যালব্যাকস, _পেন্ডিংউইনার
বেশ পার্থক্য, তাই না? বাস্তবে এটি JSON ( লাইভ ডেমো ) - এ সিরিয়ালযুক্ত পুরো অবজেক্ট , কারণ হেই আপনি আসলে এটি JSON এ সিরিয়ালায়িত করতে পারেন কারণ এতে কোনও বৃত্তাকার উল্লেখ নেই - নেটিভ ডোমের জগতের কল্পনাতীত কিছু ( যেখানে এটি কেবল একটি ব্যতিক্রম ছুঁড়ে ফেলবে) ):
{
"props": {},
"_owner": null,
"_lifeCycleState": "UNMOUNTED",
"_pendingProps": null,
"_pendingCallbacks": null,
"_pendingOwner": null
}
নেটিভ ব্রাউজার ডিওমের চেয়ে প্রতিক্রিয়া দ্রুততর হওয়ার মূল কারণ এটি - কারণ এই জগাখিচুড়ি বাস্তবায়ন করতে হবে না ।
দ্রুত কী তা দেখতে স্টিভেন লুশারের এই উপস্থাপনাটি দেখুন : সি ++ তে লিখিত নেটিভ ডিওএম বা জাভাস্ক্রিপ্টে সম্পূর্ণ লিখিত একটি নকল ডিওএম। এটি একটি খুব সুষ্ঠু এবং বিনোদনমূলক উপস্থাপনা।
আপডেট: ভবিষ্যতের সংস্করণগুলিতে অ্যাম্বার.জেস পারফোলেন্স উন্নত করতে ভার্চুয়াল ডিওএমকে ভারী ভারপ্রাপ্ত ব্যবহার করবে inspired দেখুন: নভেম্বর 15, 2014 এ টরন্টোর আম্বারগার্টেন সিম্পোজিয়াম থেকে স্টিফেন পেনারের স্টিফান পেনার দ্বারা ভবিষ্যতের অ্যাম্বারের আলাপ।
এর সংক্ষিপ্তসার হিসাবে: টেমপ্লেট, ডেটা বাঁধাই বা কাস্টম উপাদানগুলির মতো ওয়েব উপাদানগুলির বৈশিষ্ট্যগুলি রিঅ্যাক্টের চেয়ে অনেক বেশি সুবিধা পাবে তবে ডকুমেন্ট অবজেক্টের মডেলটি নিজেই উল্লেখযোগ্যভাবে সরলীকৃত না হওয়া পর্যন্ত পারফরম্যান্স সেগুলির মধ্যে একটি হবে না।
হালনাগাদ
আমি এই উত্তরগুলি পোস্ট করার দুই মাস পরে এখানে কিছু প্রাসঙ্গিক খবর রয়েছে news আমি যেমন টুইটারে লিখেছি , জাভাস্ক্রিপ্টে গিটহাব দ্বারা রচিত এটম পাঠ্য সম্পাদকটির সর্বশেষতম সংস্করণটি আরও ভাল পারফরম্যান্স পেতে ফেসবুকের প্রতিক্রিয়া ব্যবহার করে যদিও উইকিপিডিয়া অনুসারে "অ্যাটম ক্রোমিয়ামের উপর ভিত্তি করে সি ++ তে লিখিত আছে" সুতরাং এর সম্পূর্ণ নিয়ন্ত্রণ রয়েছে নেটিভ সি ++ ডোম বাস্তবায়ন ( পরমাণুর নিউক্লিয়াস দেখুন ) এবং এটি ওয়েব উপাদানগুলির জন্য সমর্থন থাকার গ্যারান্টিযুক্ত যেহেতু এটি তার নিজস্ব ওয়েব ব্রাউজার দিয়ে পাঠায়। এটি সত্যিকারের বিশ্ব প্রকল্পের একটি অতি সাম্প্রতিক উদাহরণ যা ওয়েব অ্যাপ্লিকেশনগুলির জন্য সাধারণত অপ্রতুল্য যে কোনও ধরণের অপ্টিমাইজেশন ব্যবহার করতে পারে এবং এটি অ্যাটম সত্ত্বেও, সেরা পারফরম্যান্স অর্জনের জন্য, জাভাস্ক্রিপ্টে রচিত প্রতিক্রিয়া ব্যবহার করা বেছে নিয়েছে শুরু করার জন্য প্রতিক্রিয়া দিয়ে তৈরি করা হয়নি, সুতরাং এটি করা তুচ্ছ পরিবর্তন ছিল না।
আপডেট 2
নেই টড পার্কার দ্বারা একটি আকর্ষণীয় তুলনা ব্যবহার WebPagetest কর্মক্ষমতা তুলনা করতে TodoMVC কৌণিক, দাঁড়া লেখা উদাহরণ, জ্বলন্ত আগুন, পলিমার, CanJS, Yui, নকআউট, প্রতিক্রিয়া এবং জুতার ফিতা। এটি এ পর্যন্ত সর্বাধিক উদ্দেশ্যমূলক তুলনা seen এখানে যা তাৎপর্যপূর্ণ তা হ'ল যে সমস্ত সম্পর্কিত উদাহরণগুলি সেই সমস্ত ফ্রেমওয়ার্কের বিশেষজ্ঞরা লিখেছিলেন, সেগুলি সমস্তই গিটহাব-এ পাওয়া যায় এবং যে কেউ মনে করেন যে কোডটি দ্রুত চালাতে কিছুটা অনুকূলিত হতে পারে।
আপডেট 3
ভবিষ্যতের সংস্করণগুলিতে এমবার.জেজে রিঅ্যাক্টের বেশ কয়েকটি বৈশিষ্ট্য অন্তর্ভুক্ত থাকবে যা এখানে আলোচনা করা হয়েছে (একটি ভার্চুয়াল ডিওএম এবং ডাইরেক্টরিয়াল ডেটা বন্ডিং সহ কয়েকটি নাম উল্লেখ করে) যার অর্থ যে প্রতিক্রিয়াটির উত্সটি এসেছে তা ইতিমধ্যে অন্যান্য ফ্রেমওয়ার্কে স্থানান্তরিত হয়েছে। দেখুন: দ্য রোড টু এম্বার ২.০ আরএফসি - টম ডেলের টান অনুরোধের মধ্যে আকর্ষণীয় আলোচনা (শুরু করার তারিখ: ২০১৪-১২-০৩): "এম্বার ২.০-তে আমরা একটি" ভার্চুয়াল ডিওএম "এবং ডেটা ফ্লো মডেল গ্রহণ করব যা গ্রাহকরা প্রতিক্রিয়া থেকে সেরা ধারণা এবং উপাদানগুলির মধ্যে যোগাযোগকে সহজতর করে। "
পাশাপাশি, Angular.js 2.0 এখানে আলোচিত অনেকগুলি ধারণা বাস্তবায়ন করছে।
আপডেট 4
ইগওয়ে কালুর এই মন্তব্যের জবাব দিতে আমাকে কয়েকটি বিষয়ে বিস্তারিত বলতে হবে:
"রিঅ্যাক্টের (জেএসএক্স বা সংকলন আউটপুট) তুলনা প্লেইন জাভাস্ক্রিপ্টের সাথে তুলনা করা বুদ্ধিমানের কাজ নয়, যখন প্রতিক্রিয়াটি চূড়ান্তভাবে সরল জাভাস্ক্রিপ্টে হ্রাস করে। [...] DOM সন্নিবেশের জন্য রিট্যাক্ট যে কৌশল ব্যবহার করে তা প্রতিক্রিয়া ব্যবহার না করে প্রয়োগ করা যেতে পারে। সুবিধাগুলি ব্যতীত প্রশ্নে বৈশিষ্ট্যটি বিবেচনা করার সময় কোনও বিশেষ সুবিধা যুক্ত করে না। " (সম্পূর্ণ মন্তব্য এখানে )
যদি এটি যথেষ্ট পরিমাণে পরিষ্কার না হয় তবে আমার উত্তরের অংশে আমি সরাসরি নেটিভ ডিওএম (ব্রাউজারে হোস্ট অবজেক্ট হিসাবে প্রয়োগ করা) বনাম রিএ্যাক্টের ভুয়া / ভার্চুয়াল ডিওএম (জাভাস্ক্রিপ্টে প্রয়োগ করা) এর অপারেটিংয়ের পারফরম্যান্সের সাথে তুলনা করছি । বিন্দু আমি চেষ্টা করছিলাম যে ভার্চুয়াল করে DOM জাভাস্ক্রিপ্ট বাস্তবায়িত হয় পারেন বাস্তব করে DOM সি ++ বাস্তবায়িত সুখ্যাতি এবং না জাভাস্ক্রিপ্ট (যেহেতু যা স্পষ্টত অনেক অর্থে দেখা যায় না হবে সুখ্যাতি করতে প্রতিক্রিয়া হয় জাভাস্ক্রিপ্ট লেখা)। আমার বক্তব্যটি হ'ল "নেটিভ" সি ++ কোড সবসময় "নট নেটিভ" জাভাস্ক্রিপ্টের চেয়ে দ্রুত গ্যারান্টিযুক্ত নয়। এই পয়েন্টটি বর্ণনা করার জন্য প্রতিক্রিয়া ব্যবহার করা কেবল একটি উদাহরণ ছিল।
কিন্তু এই মন্তব্য একটি আকর্ষণীয় ইস্যু স্পর্শ। এক অর্থে এটি সত্য যে কোনও কারণেই আপনার কোনও কাঠামো (প্রতিক্রিয়া, কৌণিক বা jQuery) দরকার নেই (যেমন পারফরম্যান্স, বহনযোগ্যতা, বৈশিষ্ট্য) কারণ আপনি সর্বদা ফ্রেমওয়ার্কটি আপনার জন্য যা কাজ করে তা পুনরায় তৈরি করতে পারেন এবং চক্রটি পুনরায় উদ্ভাবন করতে পারেন - যদি আপনি ব্যয়টিকে ন্যায়সঙ্গত করতে পারেন, এটি।
- কিন্তু ডেভ স্মিথ চমত্কারভাবে এটা রাখা যেমন কিভাবে পয়েন্ট মিস যখন ওয়েব ফ্রেমওয়ার্ক কর্মক্ষমতা তুলনা : "যখন দুই ওয়েব অবকাঠামো তুলনা প্রশ্ন না হয় করতে আমার অ্যাপ্লিকেশানের দ্রুত ফ্রেমওয়ার্ক এক্স সঙ্গে প্রশ্ন হল হবে আমার অ্যাপ্লিকেশানের ফ্রেমওয়ার্ক সঙ্গে দ্রুত এক্স."
ইন আমার 2011 উত্তর: কি কিছু গবেষণামূলক প্রযুক্তিগত কারণের jQuery ব্যবহার করতে হয় না আমি একটি অনুরূপ সমস্যা ব্যাখ্যা, এটা অসম্ভব jQuery মত একটি লাইব্রেরি ছাড়া পোর্টেবল করে DOM-ম্যানিপুলেশন কোড লিখতে হয় না, কিন্তু মানুষ খুব কমই তা করতে পারে।
প্রোগ্রামিং ভাষা, গ্রন্থাগার বা ফ্রেমওয়ার্কগুলি ব্যবহার করার সময়, লোকেরা কাজগুলি করার সবচেয়ে সুবিধাজনক বা মূর্তিযুক্ত পদ্ধতিগুলি ব্যবহার করার প্রবণতা রাখে, নিখুঁত তবে অসুবিধে না করে। ভাল ফ্রেমওয়ার্কগুলির আসল মানটি সহজ করে তোলে যা অন্যথায় করা কঠিন হবে - এবং গোপনীয় জিনিসটি সঠিক জিনিসকে সুবিধাজনক করে তুলছে। লাম্বদা ক্যালকুলাস বা সর্বাধিক আদিম টুরিং মেশিনের সহজ রূপ হিসাবে এখনও আপনার নিষ্পত্তিস্থলে ফলাফলের ঠিক একই শক্তি রয়েছে তবে নির্দিষ্ট ধারণার আপেক্ষিক প্রকাশের অর্থ এই যে খুব ধারণাগুলি আরও সহজে বা মোটামুটিভাবে প্রকাশিত হতে থাকে এবং সঠিক সমাধানগুলি কেবল সম্ভব নয় তবে বাস্তবে ব্যাপকভাবে প্রয়োগ করা হয়েছে।
আপডেট 5
প্রতিক্রিয়া + পারফরম্যান্স =? জুলাই ২০১৫ থেকে পল লুইসের লেখা নিবন্ধে একটি উদাহরণ দেখানো হয়েছে যেখানে ফ্লিকারের ছবিগুলির একটি অসীম তালিকার জন্য হাতে লেখা ভ্যানিলা জাভাস্ক্রিপ্টের চেয়ে প্রতিক্রিয়া ধীর গতির, যা মোবাইলে বিশেষত তাৎপর্যপূর্ণ। এই উদাহরণটি দেখায় যে প্রত্যেককে নির্দিষ্ট ব্যবহারের ক্ষেত্রে এবং নির্দিষ্ট লক্ষ্য প্ল্যাটফর্ম এবং ডিভাইসের জন্য সর্বদা পারফরম্যান্স পরীক্ষা করা উচিত।
কেভিন লোজান্দিয়ারকে এটি আমার নজরে আনার জন্য ধন্যবাদ ।