उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) · पाठ

साझा मेमोरी और एटॉमिक्स

WASM और JS के बीच उच्च-प्रदर्शन समवर्ती डेटा अभिगम के लिए SharedArrayBuffer और एटॉमिक ऑपरेशन के उपयोग का अन्वेषण करें

पाठ 3, कुल 4 में से12 चरण

साझा मेमोरी और एटॉमिक्स, CoddyKit पर उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) का एक निःशुल्क पाठ है। यह 4 में से 3वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

समवर्ती कार्य और साझा मेमोरी

उच्च-प्रदर्शन वाले अनुप्रयोग बनाते समय, विशेष रूप से WebAssembly के साथ, आपको अक्सर कार्यों को समवर्ती रूप से करना पड़ता है। इसका अर्थ है कि अपने कोड के कुछ हिस्सों को समानांतर रूप से, संभवतः अलग-अलग थ्रेड में, चलाना।

इन समवर्ती कार्यों को कुशलतापूर्वक साथ काम करने के लिए अक्सर उन्हें एक ही डेटा को ऐक्सेस और संशोधित करना पड़ता है। यहीं साझा मेमोरी काम आती है।

सिर्फ ArrayBuffer क्यों नहीं?

आप JavaScript में कच्चे बाइनरी डेटा को संभालने के लिए ArrayBuffer से पहले से परिचित हो सकते हैं। हालांकि, एक सामान्य ArrayBuffer को अलग-अलग निष्पादन संदर्भों (जैसे मुख्य थ्रेड और Web Worker के बीच, या JavaScript और WebAssembly थ्रेड के बीच) में सीधे साझा नहीं किया जा सकता।

प्रत्येक संदर्भ को डेटा की अपनी प्रतिलिपि मिलती, जिससे बार-बार होने वाले अपडेट के लिए समन्वय करना अक्षम और जटिल हो जाता।

SharedArrayBuffer का परिचय

वास्तविक समवर्ती डेटा ऐक्सेस का समाधान SharedArrayBuffer है। यह ArrayBuffer का एक विशेष प्रकार है, जो कई थ्रेड को एक ही मेमोरी ब्लॉक को एक साथ ऐक्सेस करने देता है।

इसका अर्थ है कि आपका JavaScript मुख्य थ्रेड, Web Workers और WebAssembly मॉड्यूल सभी अंतर्निहित *बिल्कुल उसी* डेटा से पढ़ और उसमें लिख सकते हैं, जिससे कुशल संचार और जटिल समानांतर गणनाएँ संभव होती हैं।

साझाकरण के लिए सुरक्षा हेडर

सुरक्षा संबंधी कमज़ोरियों (जैसे Spectre) के कारण, SharedArrayBuffer का उपयोग करने के लिए सर्वर द्वारा HTTP प्रतिक्रिया में ये विशेष हेडर सेट करना आवश्यक है:

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

ये हेडर सुनिश्चित करते हैं कि दस्तावेज़ एक पृथक, क्रॉस-ऑरिजिन पृथक ब्राउज़िंग संदर्भ में हो, जो SharedArrayBuffer के सुरक्षित रूप से काम करने के लिए आवश्यक है।

JS में SharedArrayBuffer बनाना

SharedArrayBuffer बनाना सामान्य ArrayBuffer बनाने के समान है। आप आकार को बाइट में निर्दिष्ट करते हैं। इसके बाद, मेमोरी के साथ आसानी से काम करने के लिए आप एक टाइप्ड ऐरे दृश्य (जैसे Int32Array) बना सकते हैं।

const sharedBuffer = new SharedArrayBuffer(1024); // 1KB
const sharedArray = new Int32Array(sharedBuffer);

console.log("Shared buffer created!");
console.log("Size:", sharedArray.length * Int32Array.BYTES_PER_ELEMENT, "bytes");

साझा मेमोरी का WASM दृश्य

जब कोई SharedArrayBuffer WebAssembly मॉड्यूल को पास किया जाता है (उदाहरण के लिए, WebAssembly.Memory के माध्यम से), तो WASM इस मेमोरी को अपने रैखिक मेमोरी स्पेस में मैप कर सकता है। इससे WASM कोड साझा डेटा को सीधे पढ़ और लिख सकता है।

यह सीधा ऐक्सेस प्रदर्शन के लिए महत्वपूर्ण है, क्योंकि इससे होस्ट वातावरण (JavaScript) और WASM मॉड्यूल के बीच डेटा की महँगी प्रतिलिपि बनाने से बचा जाता है।

रेस कंडीशन और डेटा सुरक्षा

मेमोरी साझा करना शक्तिशाली है, लेकिन इससे एक चुनौती आती है: रेस कंडीशन। यदि कई थ्रेड एक ही समय पर एक ही मेमोरी स्थान को पढ़ने और लिखने का प्रयास करें, तो अंतिम परिणाम अप्रत्याशित या गलत हो सकता है।

कल्पना कीजिए कि दो थ्रेड एक काउंटर को एक साथ बढ़ाने का प्रयास कर रहे हैं। उचित समन्वय के बिना, एक अपडेट दूसरे को अधिलेखित कर सकता है और गिनती गलत हो सकती है।

सुरक्षा के लिए Atomics का परिचय

रेस कंडीशन रोकने के लिए JavaScript Atomics ऑब्जेक्ट उपलब्ध कराता है। Atomics ऐसे संचालन का एक समूह प्रदान करते हैं जिनके परमाण्विक होने की गारंटी होती है, यानी उन्हें विभाजित नहीं किया जा सकता।

परमाण्विक संचालन या तो पूरी तरह पूरा होता है या बिल्कुल नहीं होता, जिससे यह सुनिश्चित होता है कि कोई दूसरा थ्रेड उसे बीच में रोक न सके। इससे साझा मेमोरी में डेटा की अखंडता बनी रहती है।

परमाण्विक पठन और लेखन

सबसे बुनियादी परमाण्विक संचालन `Atomics.load()` और `Atomics.store()` हैं। ये विधियाँ सुनिश्चित करती हैं कि साझा मेमोरी स्थान से मान पढ़ना और उसमें मान लिखना एक ही, बिना बाधित होने वाले चरण में हो।

const sharedBuffer = new SharedArrayBuffer(4); // 4 bytes
const int32View = new Int32Array(sharedBuffer);

// Safely store a value at index 0
Atomics.store(int32View, 0, 100);
console.log("Stored 100 atomically.");

// Safely load a value from index 0
const value = Atomics.load(int32View, 0);
console.log("Loaded value:", value);

परमाण्विक अंकगणितीय संचालन

साधारण पठन-लेखन के अलावा, Atomics Atomics.add(), Atomics.sub(), Atomics.and() आदि जैसे अंकगणितीय संचालन भी प्रदान करते हैं। ये किसी मान पर संचालन करके उसे परमाण्विक रूप से अपडेट करते हैं।

Atomics.add(typedArray, index, value) index पर मौजूद तत्व में value जोड़ता है और उसी सुरक्षित चरण में उस इंडेक्स का पुराना मान लौटाता है।

const sharedBuffer = new SharedArrayBuffer(4);
const int32View = new Int32Array(sharedBuffer);
Atomics.store(int32View, 0, 5); // Initial value

console.log("Initial value:", Atomics.load(int32View, 0));

// Atomically add 3 to the value at index 0
const oldValue = Atomics.add(int32View, 0, 3);
console.log("Old value before add:", oldValue);
console.log("New value after add:", Atomics.load(int32View, 0));

साझा मेमोरी जाँच

निम्नलिखित JavaScript कोड अंश पर विचार कीजिए। मान लीजिए कि sharedBuffer सही ढंग से कॉन्फ़िगर किया गया SharedArrayBuffer है और int32View उसका Int32Array दृश्य है।

const int32View = new Int32Array(sharedBuffer);
Atomics.store(int32View, 0, 5);
const result = Atomics.add(int32View, 0, 2);
const finalValue = Atomics.load(int32View, 0);

इंटरैक्टिव पाठ में इसका उत्तर दें

पुनरावलोकन: साझा मेमोरी और Atomics

हमने देखा कि SharedArrayBuffer कई थ्रेड को एक ही मेमोरी ब्लॉक ऐक्सेस करने की अनुमति देकर JavaScript और WebAssembly के बीच कुशल समवर्ती डेटा ऐक्सेस कैसे संभव बनाता है।

रेस कंडीशन के कारण होने वाले डेटा भ्रष्टाचार को रोकने के लिए हमने Atomics के बारे में सीखा, जो साझा मेमोरी में डेटा पढ़ने, लिखने और संशोधित करने के लिए सुरक्षित, अविभाज्य संचालन प्रदान करते हैं।

उच्च-प्रदर्शन वाले, बहु-थ्रेड वाले WebAssembly अनुप्रयोग बनाने के लिए ये उपकरण अत्यंत महत्वपूर्ण हैं।

शुरुआत निःशुल्क

एआई शिक्षक के साथ उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) सीखें — निःशुल्क

अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।

पाठ्यक्रम: 12
पाठ: 48

निःशुल्क सीखना शुरू करें पूरा पाठ्यक्रम देखें

अक्सर पूछे जाने वाले प्रश्न

क्या “साझा मेमोरी और एटॉमिक्स” पाठ निःशुल्क है?

हाँ—“साझा मेमोरी और एटॉमिक्स” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

“साझा मेमोरी और एटॉमिक्स” में मैं क्या सीखूँगा?

WASM और JS के बीच उच्च-प्रदर्शन समवर्ती डेटा अभिगम के लिए SharedArrayBuffer और एटॉमिक ऑपरेशन के उपयोग का अन्वेषण करें आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।

क्या उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?

पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 3वाँ पाठ है।

“साझा मेमोरी और एटॉमिक्स” पाठ पूरा करने में कितना समय लगता है?

CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।

क्या मैं इस उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) पाठ में कोड लिख और चला सकता हूँ?

हाँ। हर उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।

इस पाठ्यक्रम के सभी पाठ

← उच्च-प्रदर्शन अनुप्रयोगों के लिए WebAssembly (WASM) पर वापस जाएँ