वेबसाइट की परफ़ॉर्मेंस की जानकारी के पैटर्न
इस कलेक्शन में ऐसे पैटर्न शामिल हैं जिन्हें लागू करना अक्सर मुश्किल होता है. इससे आपकी वेबसाइट की परफ़ॉर्मेंस की जानकारी के स्कोर पर कोई असर नहीं पड़ता. इन उदाहरणों में दिए गए कोड का इस्तेमाल करके, यह पक्का करें कि आपके प्रोजेक्ट सही राह पर हैं.
- लंबे टास्क ऑप्टिमाइज़ करें
- पैसे चुकाने का तरीका सेट अप करना
- मॉड्यूल पहले से लोड करें
- अपने फ़ॉर्म पर ब्राउज़र की ऑटोमैटिक भरने की सुविधा को मेज़र करना
- दूसरा हिस्सा: क्लाइंट-साइड एआई की मदद से, आपत्तिजनक कॉन्टेंट का पता लगाना
- पहला हिस्सा: ऑनलाइन प्लैटफ़ॉर्म पर बुरे बर्ताव को रोकने के लिए क्लाइंट-साइड एआई
- ब्लॉक करने का कुल समय (टीबीटी)
- वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली मेट्रिक मापना शुरू करना
- सबसे बड़े कॉन्टेंटफ़ुल पेंट को ऑप्टिमाइज़ करें
- वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने के सबसे असरदार तरीके
- Web Vitals
- सीएसएस content-visibility प्रॉपर्टी अब बेसलाइन के तौर पर उपलब्ध है
- खास जानकारी देने की सुविधा के साथ एलएलएम की तुलना करना
- वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली मेट्रिक के थ्रेशोल्ड कैसे तय किए गए थे
- Google के टूल का इस्तेमाल करके, वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाले वर्कफ़्लो
- लैब में धीमे इंटरैक्शन का मैन्युअल रूप से विश्लेषण करें
- बेसलाइन
- बैक-फ़ॉरवर्ड कैश मेमोरी
- CSSNestedDeclarations की मदद से, सीएसएस नेस्टिंग बेहतर होती है
- First Input Delay (FID)
- फ़ील्ड में परफ़ॉर्मेंस को डीबग करना
- Google टूल की मदद से, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी और विज्ञापन से मिलने वाले रेवेन्यू को जोड़ना
- क्लाइंट-साइड एआई के लिए, परफ़ॉर्मेंस और उपयोगकर्ता अनुभव को बेहतर बनाएं
- सीएसएस @property की परफ़ॉर्मेंस का मानदंड
- ऑफ़स्क्रीन iframe को लेज़ी-लोड करने का समय आ गया है!
- वेब के लिए स्टोरेज
- एक ही डोमेन पर, कई प्रोग्रेसिव वेब ऐप्लिकेशन बनाना
- वेब पुश प्रोटोकॉल
- Chrome, वेब ऐप्लिकेशन मेनिफ़ेस्ट के अपडेट कैसे मैनेज करता है
- एक अच्छा प्रोग्रेसिव वेब ऐप्लिकेशन क्या होता है?
- इसे इंस्टॉल करने के लिए क्या ज़रूरी है?
- वेब ऐप्लिकेशन मेनिफ़ेस्ट जोड़ें
- कॉन्टेंट की सुरक्षा के बारे में सख्त नीति (सीएसपी) का इस्तेमाल करके, क्रॉस-साइट स्क्रिप्टिंग (XSS) को कम करें
- वेब पर हार्डवेयर डिवाइसों को ऐक्सेस करना
- मिलती-जुलती ऑरिजिन अनुरोधों की मदद से, अपनी सभी साइटों पर पासकी का फिर से इस्तेमाल करने की अनुमति दें
- सही इमेज फ़ॉर्मैट चुनना
- वेब के लिए ब्राउज़र-लेवल की इमेज लेज़ी लोडिंग
- कस्टम मेट्रिक
- Google Analytics 4 और BigQuery की मदद से, परफ़ॉर्मेंस को मेज़र और डीबग करना
- वेब अनुमतियों से जुड़े सबसे सही तरीके
- कुकी की सूचनाओं के लिए सबसे सही तरीके
- Media Session API की मदद से, मीडिया सूचनाओं और प्लेबैक कंट्रोल को पसंद के मुताबिक बनाएं
- Tabindex का इस्तेमाल करना
- फ़ील्ड में धीमे इंटरैक्शन का पता लगाना
- पहली बाइट का समय (TTFB)
- छोटे एलएलएम के लिए प्रैक्टिकल प्रॉम्प्ट इंजीनियरिंग
- पहली बाइट के लिए समय ऑप्टिमाइज़ करें
- इंटरैक्शन टू नेक्स्ट पेंट (आईएनपी)
- लाइट-डार्क() के साथ सीएसएस कलर-स्कीम पर निर्भर रंग
- वेब ऐप्लिकेशन के लिए WebAssembly परफ़ॉर्मेंस के पैटर्न
- सीएसएस का ऐनिमेशन वाला ग्रिड लेआउट
- अपने गेमपैड से Chrome Dino गेम खेलें
- इनर्ट एट्रिब्यूट
- नैतिकता और एआई (AI)
- Web.dev की एआई टीम से मिलें
- आर्टिफ़िशियल इंटेलिजेंस क्या है?
- अपनी साइट खोज को अपग्रेड करें: जनरेटिव एआई की मदद से, काम के जवाब पाएं
- AAGUID की मदद से, पासकी की सेवा देने वाली कंपनी का पता लगाना
- बाइनरी के साथ Wasm को कंपाइल और ऑप्टिमाइज़ करना
- <मॉडल-व्यूअर> वेब कॉम्पोनेंट
- HTML5 में ऑडियो और वीडियो कैप्चर करें
- उपयोगकर्ता की पुष्टि से जुड़ी पूरी जानकारी
- CrUX डेटा, मेरे RUM डेटा से अलग क्यों है?
- वेब डेवलपर के लिए सुलभता
- Largest Contentful Paint (LCP)
- तीसरे पक्ष की JavaScript लोड करें
- अगर कोई पासकी पहले से मौजूद है, तो नई पासकी बनाने से रोकें
- IndexedDB के साथ काम करना
- 5 सीएसएस स्निपेट, जिनके बारे में हर फ़्रंट-एंड डेवलपर को साल 2024 में पता होना चाहिए
- यूआरएल के कौनसे हिस्से होते हैं?
- खोजे जा सकने वाले क्रेडेंशियल के बारे में पूरी जानकारी
- परफ़ॉर्मेंस रेंडरिंग
- Resize ऑब्ज़र्वर: यह एलिमेंट के लिए, document.onresize की तरह काम करता है
- टेक्स्ट-आधारित एसेट की एन्कोडिंग और ट्रांसफ़र आकार को ऑप्टिमाइज़ करें
- ऑफ़स्क्रीन कैनवस—वेब वर्कर के साथ अपनी कैनवस प्रोसेस में तेज़ी लाएं
- First Contentful Paint (FCP)
- कॉन्टेंट डिलीवरी नेटवर्क (सीडीएन)
- एक अच्छा साइन-आउट अनुभव देने के लिए क्या ज़रूरी है?
- इंटरैक्टिव में लगने वाला समय (TTI)
- Fetch Priority API की मदद से, संसाधन लोड होने की प्रोसेस को ऑप्टिमाइज़ करें
- :user-मान्य और :user-अमान्य सूडो-क्लास
- कारोबार के बारे में ज़रूरी फ़ैसले लेने वालों के लिए, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी को ऑप्टिमाइज़ करना
- JavaScript में base64 एन्कोडिंग स्ट्रिंग की बारीकियां
- सीएसएस का सबग्रिड
- पेज स्पीड पर असर डाले बिना, असरदार तरीके से विज्ञापन लोड करना
- कोड कवरेज के चार सामान्य टाइप
- जांच करने या न करने के बारे में, तकनीकी जानकारी
- टेस्ट केस और प्राथमिकताएं तय करना
- उपयोगकर्ता के हिसाब से बनाई गई परफ़ॉर्मेंस मेट्रिक
- रिस्पॉन्सिव इमेज को पहले से लोड करें
- सीएसएस की मदद से, टाइपोग्राफ़ी को उपयोगकर्ता की पसंद के मुताबिक बनाना
- पिरामिड या केकड़ा? टेस्टिंग की ऐसी रणनीति ढूंढें जो
- टेस्ट ऑटोमेशन के तीन सामान्य टाइप
- ग़ैर-ज़रूरी डाउनलोड को हटाना
- WebAssembly क्या है और यह कहां से आया?
- mkbitmap को WebAssembly में कंपाइल करना
- ऑरिजिन निजी फ़ाइल सिस्टम
- नए वेब ऐप्लिकेशन में उपयोगकर्ता के डेटा को सुरक्षित तरीके से होस्ट करना
- ज़्यादा रिस्पॉन्सिव वेबसाइटों के लिए AVIF को डिप्लॉय करना
- इंटरैक्शन को नेक्स्ट पेंट के लिए ऑप्टिमाइज़ करना
- बुनियादी सुविधाएं, जिनका इस्तेमाल आज किया जा सकता है
- इनपुट में देरी को ऑप्टिमाइज़ करें
- एचटीएमएल और इंटरैक्टिविटी की क्लाइंट-साइड रेंडरिंग
- बड़े DOM साइज़, इंटरैक्टिविटी पर कैसे असर डालते हैं और इस बारे में क्या किया जा सकता है
- स्क्रिप्ट इवैलुएशन और लंबे टास्क
- वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाले एक्सटेंशन का इस्तेमाल करके, वेबसाइट की परफ़ॉर्मेंस की जानकारी की समस्याओं को डीबग करना
- कुल लेआउट शिफ़्ट ऑप्टिमाइज़ करें
- Cumulative Layout Shift (CLS)
- WordPress Playground और WebAssembly की मदद से, ब्राउज़र में मौजूद WordPress की सुविधाओं को इस्तेमाल करने का अनुभव पाएं
- डेवलपर के लिए नई सुविधा—जिसे WebAssembly ने आपके लिए उपलब्ध कराया है
- ऐप स्टोर में PWA
- सोर्स मैप क्या होते हैं?
- 6 सीएसएस स्निपेट, जिनके बारे में हर फ़्रंट-एंड डेवलपर को साल 2023 में पता होना चाहिए
- CSS में त्रिकोणमितीय फ़ंक्शन
- requestVideoFrameCallback() की मदद से, हर वीडियो फ़्रेम के हिसाब से बेहतर कार्रवाइयां करें
- GDE समुदाय का हाइलाइट: लार्स नुडसन
- मीडिया ऐप्लिकेशन के लिए नए पैटर्न
- तेज़ सीएसएस सलाह! ऐनिमेटेड ग्रेडिएंट टेक्स्ट
- Chrometober बनाया जा रहा है!
- टूलटिप कॉम्पोनेंट बनाना
- फ़ॉर्म को ऑटोमैटिक भरने की सुविधा की मदद से, पासकी से साइन इन करना
- बिना पासवर्ड के लॉगिन करने के लिए पासकी बनाएं
- फ़्लोटिंग ऐक्शन बटन (एफ़एबी) कॉम्पोनेंट बनाना
- फ़ॉन्ट इस्तेमाल करने के सबसे सही तरीके
- जीडीई समुदाय का हाइलाइट: अल्बा सिल्वेंटे फ़ुएंतेस
- वेब डिज़ाइन के रंग कंट्रास्ट की जांच करना
- तेज़ सीएसएस सलाह! एनिमेटेड लोडर
- किसी वेबसाइट के लिए मुख्य नेविगेशन बनाना
- क्या यह :मॉडल है?
- टेढ़ा-मेढ़ा ग्रिड इल्यूज़न बनाना
- क्रिएटिव सूची की स्टाइलिंग
- टैग और टैग मैनेजर के लिए सबसे सही तरीके
- Nordhealth, वेब कॉम्पोनेंट में कस्टम प्रॉपर्टी का इस्तेमाल कैसे करती है
- सीएसएस पर बेहतर कंट्रोल, अलग-अलग ट्रांसफ़ॉर्म प्रॉपर्टी के साथ बदल जाता है
- सीएसएस बॉर्डर ऐनिमेशन
- बेहतर सुरक्षा और परफ़ॉर्मेंस के लिए, BBC किस तरह एचएसटीएस को रोल आउट कर रहा है.
- लैब और फ़ील्ड डेटा अलग-अलग क्यों हो सकते हैं और इसके बारे में क्या करना चाहिए
- सबके लिए एक फ़ायदा
- Internet Explorer के आखिर में
- HTML5Rocks से विदाई
- पहले-पक्ष की कुकी बनाने की रेसिपी
- वेब पर ऑडियो और वीडियो प्लेबैक सिंक करें
- कूल बॉर्डर बनाने के लिए कोनिक ग्रेडिएंट का इस्तेमाल करें
- JavaScript लाइब्रेरी और फ़्रेमवर्क के बीच अंतर
- फ़ेच एपीआई का इस्तेमाल करते समय गड़बड़ी ठीक करने के तरीके को लागू करें
- JavaScript लाइब्रेरी या फ़्रेमवर्क चुनना
- तेज़ और खूबसूरत वेब फ़ॉन्ट के लिए एपीआई
- टर्मिनल के लिए फ़्रंट-एंड डेवलपर की गाइड
- GOV.UK अपने फ़्रंट एंड से jQuery को ड्रॉप करता है.
- बटन कॉम्पोनेंट बनाना
- ब्राउज़र प्रीलोड स्कैनर से मुकाबला न करें
- फ़ील्ड में, वेबसाइट की परफ़ॉर्मेंस की जानकारी को मेज़र करने के सबसे सही तरीके
- कमियों को दूर करना
- डेवलपर कम्यूनिटी में हिम्मत और प्रेरणा मिलना
- असल ज़िंदगी में बदलाव करने वाले फ़ॉन्ट
- सीएसएस ग्रेडिएंट क्रिएटर की मदद से, तेज़ी से अच्छे सीएसएस ग्रेडिएंट बनाएं
- टॉप वेब डेवलपर से जुड़ी समस्याओं के बारे में ज़्यादा जानें
- images.tooling.report की मदद से अपनी साइट को बेहतर बनाएं
- ग्लोबल और लोकल वैरिएबल स्कोप
- डायलॉग कॉम्पोनेंट बनाना
- वेब पर मीडिया चलाने से जुड़ी गड़बड़ियां डीबग करना
- GDE कम्यूनिटी हाइलाइट: निशु गोयल
- बहुत ज़्यादा लेज़ी लोडिंग के परफ़ॉर्मेंस असर
- लोडिंग बार कॉम्पोनेंट बनाना
- Forms से क्रेडेंशियल सेव करें
- Chrome और Firefox जल्द ही मेजर वर्शन 100 पर पहुंचने वाले हैं
- उपयोगकर्ताओं के हिसाब से फ़ेविकॉन बनाना
- Emscripten में कैनवस की तरफ़ ड्रॉइंग
- एचटीटीपी कैश मेमोरी को अपडेट करके, सुरक्षा और निजता को बेहतर बनाएं
- अतिरिक्त एचटीएमएल एलिमेंट
- USB ऐप्लिकेशन को वेब पर पोर्ट किया जा रहा है. भाग 2: gPhoto2
- नेटवर्क की गड़बड़ी का डेटा लॉग करने की सुविधा (NEL)
- WebAssembly सुविधा का पता लगाने की सुविधा
- USB ऐप्लिकेशन को वेब पर पोर्ट किया जा रहा है. भाग 1: li एक्सटेंशन
- थीम स्विच करने वाला कॉम्पोनेंट बनाना
- Emscripten के साथ C++ में JavaScript स्निपेट एम्बेड करना
- Oculus Quest 2 पर PWA
- बिल्डिंग डिज़ाइनसींबर
- Designcember कैलकुलेटर
- स्ट्रक्चर्डClone का इस्तेमाल करके, JavaScript में डीप-कॉपी करना
- टोस्ट कॉम्पोनेंट बनाना
- यूज़र इंटरफ़ेस (यूआई) फ़ंड
- 3D गेम मेन्यू कॉम्पोनेंट बनाना
- PageSpeed Insights में नया क्या है
- Chrome Dev Summit 2021 में लॉन्च की गई सभी सुविधाओं के बारे में जानकारी
- ऐनिमेशन के स्मूदनेस मेट्रिक की ओर
- लाइटहाउस यूज़र फ़्लो
- Photoshop की वेब की यात्रा
- एक से ज़्यादा कॉम्पोनेंट चुनने की सुविधा का इस्तेमाल करना
- नेविगेशन टाइमिंग और रिसॉर्स टाइमिंग की मदद से, फ़ील्ड में लोड होने की परफ़ॉर्मेंस का आकलन करने का तरीका
- Sanitizer एपीआई की मदद से, DOM में सुरक्षित बदलाव करना
- तीसरे पक्ष के एम्बेड इस्तेमाल करने के सबसे सही तरीके
- एसपीए आर्किटेक्चर, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी पर कैसे असर डालते हैं
- JavaScript इवेंट के बारे में ज़्यादा जानकारी
- JavaScript के अलावा, दूसरे संसाधनों को इकट्ठा करना
- स्प्लिट बटन वाला कॉम्पोनेंट बनाना
- स्टाइलशीट इंपोर्ट करने के लिए, सीएसएस मॉड्यूल स्क्रिप्ट का इस्तेमाल करना
- सीएसएस एक्सेंट-रंग
- स्विच कॉम्पोनेंट बनाना
- उपयोगकर्ता की पसंद के मीडिया की सुविधाएं, क्लाइंट हिंट के हेडर
- ब्रेडक्रंब कॉम्पोनेंट बनाना
- C, C++, और Rust से मिले WebAssembly थ्रेड का इस्तेमाल करना
- मीडिया फ़्रेमवर्क
- मीडिया स्ट्रीमिंग के बारे में बुनियादी बातें
- ऑफ़लाइन स्ट्रीमिंग की सुविधा वाला PWA
- मीडिया एन्क्रिप्ट (सुरक्षित) करने का तरीका
- वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाले एक्सटेंशन के अपडेट में फ़ील्ड डेटा की मदद से रास्ता जानें
- कलर स्कीम बनाना
- @font-face के लिए सीएसएस का साइज़ घटाना या बढ़ाना
- AVIF का इस्तेमाल करके अपनी साइट पर इमेज कंप्रेस करना
- वेब टूलिंग में कुल लेआउट शिफ़्ट में बदलाव
- वेबसाइट की परफ़ॉर्मेंस की जानकारी देने वाली सीएसएस
- सीएसएस के नए फ़ंक्शनल सूडो-क्लास सिलेक्टर :is() और :where()
- प्रोग्रेसिव वेब ऐप्लिकेशन की नई ट्रेनिंग अब उपलब्ध है
- नया रिस्पॉन्सिव: कॉम्पोनेंट-आधारित दुनिया में वेब डिज़ाइन
- उपयोगकर्ता-एजेंट क्लाइंट हिंट पर माइग्रेट करना
- सुरक्षा हेडर के बारे में फटाफट जानकारी
- एक्सकैलिड्रॉ और फुगु: उपयोगकर्ताओं के मुख्य अनुभवों को बेहतर बनाना
- सर्विस वर्कर में ES मॉड्यूल
- मीडिया स्क्रोलर कॉम्पोनेंट बनाना
- Lighthouse का इस्तेमाल करके, वेबसाइट की परफ़ॉर्मेंस की जानकारी को ऑप्टिमाइज़ करना
- WebAssembly से एसिंक्रोनस वेब एपीआई इस्तेमाल करना
- तीसरे पक्ष की स्क्रिप्ट को कंट्रोल में रखना
- अपने PWA के टाइटल बार की विंडो कंट्रोल ओवरले को पसंद के मुताबिक बनाएं
- WebOTP एपीआई की मदद से, क्रॉस-ऑरिजिन iframe में ओटीपी फ़ॉर्म भरें
- DataTransfer API का इस्तेमाल करके समस्याएं हल करना
- स्प्लिट टेक्स्ट ऐनिमेशन बनाना
- सीएलएस मेट्रिक को बेहतर बनाना
- वेब डेवलपर से जुड़ी संतुष्टि
- सेटिंग कॉम्पोनेंट बनाना
- लेआउट शिफ़्ट को डीबग करें
- JavaScript: इसका क्या मतलब है?
- मिनी ऐप्लिकेशन ओपन सोर्स प्रोजेक्ट
- मिनी ऐप्लिकेशन के हिसाब से प्रोग्रामिंग करना
- उदाहरण प्रोजेक्ट में मिनी ऐप्लिकेशन की प्रोग्रामिंग के सिद्धांतों को लागू करना
- प्रोजेक्ट स्ट्रक्चर, लाइफ़साइकल, और बंडलिंग
- वेब डेवलपर के मिनी ऐप्लिकेशन के बारे में विचार खत्म करते समय
- मिनी ऐप्लिकेशन मार्कअप, स्टाइल, स्क्रिप्टिंग, और अपडेट करना
- मिनी ऐप्लिकेशन कॉम्पोनेंट
- H5 और QuickApp क्या हैं?
- स्ट्रीम—खास गाइड
- टैब कॉम्पोनेंट बनाना
- क्रॉस-ऑरिजिन आइसोलेशन चालू करने के लिए गाइड
- ऑरिजिन-एजेंट-क्लस्टर हेडर की मदद से, परफ़ॉर्मेंस आइसोलेशन का अनुरोध करना
- सीएसएस का आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात) प्रॉपर्टी
- WebRTC अब W3C और IETF का स्टैंडर्ड वर्शन है
- कैरसेल के लिए सबसे सही तरीके
- लोकल डेवलपमेंट के लिए एचटीटीपीएस का इस्तेमाल कब करना चाहिए
- लोकल डेवलपमेंट के लिए एचटीटीपीएस का इस्तेमाल करना
- सुझाव, शिकायत या राय: लंबे समय तक पेजों पर रहने वाले पेजों के लिए, लेआउट शिफ़्ट की बेहतर मेट्रिक उपलब्ध कराना
- साइडनेव कॉम्पोनेंट बनाना
- कोडलैब: साइडनेव कॉम्पोनेंट बनाना
- सीएसएस में फ़ोकस करना
- कोडलैब (कोड बनाना सीखना): सीएसएस में सेंटर देना
- कैश मेमोरी में सेव करें ❤️
- क्रॉस-ब्राउज़र पेंट वर्कलेट और Houdini.how
- एसएमएस से ओटीपी फ़ॉर्म इस्तेमाल करने के सबसे सही तरीके
- पते वाले फ़ॉर्म के लिए सबसे सही तरीकों के लिए कोडलैब
- पेमेंट और पते का फ़ॉर्म इस्तेमाल करने के सबसे सही तरीके
- AutoWebPerf की मदद से ऑटोमेशन ऑडिट करना
- पेमेंट फ़ॉर्म के लिए सबसे सही तरीकों के लिए कोडलैब
- साइन-अप फ़ॉर्म के लिए सबसे सही तरीकों के लिए कोडलैब
- साइन-अप फ़ॉर्म के सबसे सही तरीके
- इंपेरेटिव कैशिंग गाइड
- कर्मचारियों की खास जानकारी
- सर्विस वर्कर के साथ दोतरफ़ा बातचीत
- सर्विस वर्कर वाले पेजों पर अपडेट ब्रॉडकास्ट करें
- गेम खेलने का बेहतर अनुभव पाने के लिए, माउस से रफ़्तार बढ़ाने की सुविधा बंद करें
- स्टोरीज़ वाला कॉम्पोनेंट बनाना
- कोडलैब: स्टोरीज़ से जुड़ा कॉम्पोनेंट बनाना
- स्कीमफ़ुल सेम-साइट
- कॉन्टेंट मैनेजमेंट सिस्टम के लिए, ब्राउज़र-लेवल पर लेज़ी लोडिंग
- कोडलैब (कोड बनाना सीखना): पुश नोटिफ़िकेशन क्लाइंट बनाना
- कोडलैब (कोड बनाना सीखना): पुश नोटिफ़िकेशन सर्वर बनाना
- पुश नोटिफ़िकेशन की खास जानकारी
- ऑफ़लाइन इस्तेमाल को मापा जा रहा है
- अच्छी परफ़ॉर्मेंस वाले सीएसएस ऐनिमेशन के उदाहरण
- साइन किए हुए एक्सचेंज (एसएक्सजी)
- सीएसएस min(), max(), और clamp()
- फ़्लो-रिलेटिव शॉर्टहैंड की मदद से, लॉजिकल लेआउट को बेहतर बनाना
- सर्विस वर्कर में रेंज के अनुरोधों को मैनेज करना
- बेहतर परफ़ॉर्मेंस वाले सीएसएस ऐनिमेशन बनाने का तरीका
- कुछ ऐनिमेशन धीमे क्यों होते हैं?
- कैमरा पैन, टिल्ट, और ज़ूम को कंट्रोल करें
- तीसरे पक्ष के ऑरिजिन ट्रायल क्या हैं?
- अलग विंडो मेमोरी लीक
- ऑफ़लाइन फ़ॉलबैक पेज बनाना
- Core Web Vitals
- CSS'की क्लिप-पाथ प्रॉपर्टी की मदद से दिलचस्प इमेज आकार बनाएं
- सीएसएस की मास्क-इमेज प्रॉपर्टी वाली इमेज पर इफ़ेक्ट लागू करें
- सीएसएस ::मार्कर के साथ कस्टम बुलेट
- पासवर्ड बदलने के लिए एक लोकप्रिय यूआरएल जोड़कर, लोगों को आसानी से पासवर्ड बदलने में मदद करें
- सर्विस वर्कर के साथ, पेमेंट की वैकल्पिक जानकारी मैनेज करना
- सर्विस वर्कर के साथ पेमेंट से जुड़े लेन-देन को पूरा करना
- ARIA: ज़हर या ऐंटीडोट?
- Emscripten का इस्तेमाल करके, WebAssembly में मेमोरी लीक होने की जानकारी को डीबग करना
- content-vision: वह नई सीएसएस प्रॉपर्टी, जो आपकी रेंडरिंग की परफ़ॉर्मेंस को बेहतर बनाती है
- क्लिपबोर्ड का ऐक्सेस अनब्लॉक किया जा रहा है
- रेफ़रर और रेफ़रल देने वाली नीति के सबसे सही तरीके
- Android पर वेब
- Google में PWA बनाना, भाग 1
- Lighthouse CI की मदद से, परफ़ॉर्मेंस पर नज़र रखना
- Google खातों पर पासकी का उपयोगकर्ता अनुभव डिज़ाइन करना
- @property: सीएसएस वैरिएबल को सुपरपावर देना
- वेब आधारित पेमेंट ऐप्लिकेशन रजिस्टर करना
- सर्विस वर्कर कैशिंग और एचटीटीपी कैशिंग
- साइट स्पीड और कारोबार मेट्रिक से जुड़ा हुआ
- वेब पर आधारित पेमेंट ऐप्लिकेशन की खास जानकारी
- Android पेमेंट ऐप्लिकेशन से शिपिंग और संपर्क जानकारी देना
- नेविगेशन के अनुरोधों को मैनेज करना
- फ़ील्ड में परफ़ॉर्मेंस का पता लगाने के लिए, Chrome UX रिपोर्ट का इस्तेमाल करना
- devicePixelContentBox के साथ Pixel-परफ़ेक्ट रेंडरिंग
- सीएसएस की एक लाइन में 10 नए लेआउट
- web.dev लाइव रैप-अप
- साइन-इन फ़ॉर्म बनाने के लिए, क्रॉस-प्लैटफ़ॉर्म ब्राउज़र सुविधाओं का इस्तेमाल करें
- अपने प्रोग्रेसिव वेब ऐप्लिकेशन को धीरे-धीरे और बेहतर बनाएं
- साइन-इन फ़ॉर्म के सबसे सही तरीके
- Google Search में JavaScript की समस्याओं को डीबग करने के लिए, वेब डेवलपर टूल
- Workbox की मदद से खोज के बेहतर अनुभव देना
- किसी वेब पेज पर मीडिया जोड़ना
- बोल्डली से वहां लिंक करें जहां पहले किसी ने लिंक नहीं किया है: टेक्स्ट फ़्रैगमेंट
- अपने PWA को एक ऐप्लिकेशन की तरह बनाएं
- ब्राउज़र की गड़बड़ी को ठीक करने का तरीका
- आरएआईएल मॉडल की मदद से परफ़ॉर्मेंस मापना
- Quicklink की मदद से प्रतिक्रिया दें में नेविगेशन की रफ़्तार बढ़ाना
- फ़ेच मेटाडेटा की मदद से, अपने संसाधनों को वेब हमलों से बचाएं
- कॉन्टेंट को फिर से क्रम में लगाना
- Chromium 84 में Web Animations API के सुधार
- वेब पेमेंट की सुविधा का इस्तेमाल करके, पेमेंट करने वाले ऐप्लिकेशन को सशक्त बनाना
- Android पेमेंट ऐप्लिकेशन डेवलपर गाइड
- किसी लेन-देन की अवधि
- Chromium 83 में, macOS सिस्टम-यूआई वाले फ़ॉन्ट के लिए, अलग-अलग फ़ॉन्ट के ज़्यादा विकल्प
- ऐप शॉर्टकट की मदद से तेज़ी से काम करें
- प्रोग्रेसिव वेब ऐप्लिकेशन, कारोबार को सफल कैसे बना सकते हैं
- Appकैश मेमोरी को हटाने की तैयारी करना
- स्थायी जगह
- इंस्टॉल करने की रणनीति तय करने का तरीका
- CommonJS आपके बंडल को कैसे बड़ा कर रहा है
- Chrome में वेब ऑडियो ऐप्लिकेशन की प्रोफ़ाइल बनाना
- बेहतरीन सुविधाओं के लिए, आपको "क्रॉस-ऑरिजिन आइसोलेटेड" की ज़रूरत क्यों है
- बारीकी से अलग-अलग सेक्शन में बांटने के साथ-साथ Next.js और Gatsby पेज लोड होने की प्रोसेस को बेहतर बनाया गया
- "सेम-साइट" और "समान-ऑरिजिन"
- COOP और COEP का इस्तेमाल करके, अपनी वेबसाइट को "क्रॉस-ऑरिजिन आइसोलेटेड" बनाना
- measureUserAgentspecificMemory() की मदद से, अपने वेब पेज के कुल मेमोरी इस्तेमाल पर नज़र रखें
- web.dev इंजीनियरिंग ब्लॉग #1: हम साइट कैसे बनाते हैं और वेब कॉम्पोनेंट का इस्तेमाल कैसे करते हैं
- कलर-स्कीम सीएसएस प्रॉपर्टी और उससे जुड़े मेटा टैग के साथ बेहतर गहरे रंग वाले मोड की डिफ़ॉल्ट स्टाइल
- पक्का करें कि COVID-19 के दौरान आपकी वेबसाइट सभी के लिए उपलब्ध और इस्तेमाल करने लायक है
- कलर और कंट्रास्ट की सुलभता
- सर्वर से ज़्यादा लोड होने की समस्या को ठीक करना
- ऐक्सेस किया जा सकने वाला रिस्पॉन्सिव डिज़ाइन
- वे टैप टारगेट जिन्हें ऐक्सेस किया जा सकता है
- 'भरोसेमंद टाइप' की मदद से, DOM-आधारित क्रॉस-साइट स्क्रिप्टिंग के जोखिमों को रोकें
- अपने Android ऐप्लिकेशन में PWA का इस्तेमाल करना
- वैकल्पिक फ़ॉन्ट पहले से लोड करके, लेआउट शिफ़्ट होने और न दिखने वाले टेक्स्ट (एफ़ओआईटी) के फ़्लैश से बचें
- nginx का इस्तेमाल करके, साइन किए हुए एचटीटीपी एक्सचेंज (एसएक्सजी) को उपलब्ध कराने का तरीका
- nginx का इस्तेमाल करके, साइन किए हुए एचटीटीपी एक्सचेंज (एसएक्सजी) सेट अप करने का तरीका
- मीडिया क्वेरी के साथ सीएसएस की बैकग्राउंड इमेज को ऑप्टिमाइज़ करना
- क्रॉस-फ़ंक्शनल तरीके से वेबसाइट की स्पीड को ठीक करना
- लेआउट में बदलाव करने के बाद स्नैप करना स्क्रोल करें
- वेब पैकेजर का इस्तेमाल करके साइन किए गए एक्सचेंज को सेट अप करने का तरीका
- ऐप्लिकेशन के अंदर इंस्टॉल करने का अनुभव देने का तरीका
- वर्चुअल ऑब्जेक्ट को असल दुनिया के व्यू में दिखाना
- ऑगमेंटेड रिएलिटी (एआर): आपको शायद इसके बारे में पहले से पता है
- वर्चुअल रिएलिटी अब वेब पर उपलब्ध, दूसरा पार्ट
- वेब फ़्रेमवर्क नेटवर्क को बेहतर बनाना
- प्रोग्रेसिव वेब ऐप्लिकेशन क्या हैं?
- मास्केबल आइकॉन के साथ, PWA में अडैप्टिव आइकॉन की सुविधा
- Workbox की मदद से, PWA को पहले से मौजूद शेयर किए जाने वाले यूज़र इंटरफ़ेस (यूआई) के साथ इंटिग्रेट करना
- सिंक्रोनस XMLHttpRequest() में, पेज खारिज होने की स्थिति को बेहतर बनाना
- मॉड्यूल वर्कर से वेब पर थ्रेड की सुविधा
- अडैप्टिव लोडिंग: धीमे डिवाइसों पर वेब की परफ़ॉर्मेंस को बेहतर बनाना
- स्पीड टूल के विकास: Chrome डेवलपर सम्मेलन 2019 की हाइलाइट
- ब्राउज़र के मुख्य थ्रेड से JavaScript चलाने के लिए वेब वर्कर का इस्तेमाल करें
- इमेज ऑप्टिमाइज़ेशन सर्वे 2019 की गर्मियों के आधार पर मिले सुझाव
- पुश नोटिफ़िकेशन सर्वर बनाना
- Next.js में रूट प्रीफ़ेच करना
- Next.js के साथ डिफ़ॉल्ट रूप से परफ़ॉर्मेंस
- Next.js में डाइनैमिक इंपोर्ट के साथ कोड बांटना
- Web Share API की मदद से, ओएस शेयरिंग यूज़र इंटरफ़ेस (यूआई) के साथ इंटिग्रेट करें
- एएमपी किस तरह आपके Next.js ऐप्लिकेशन में स्पीड की गारंटी दे सकता है
- वर्चुअल रिएलिटी अब वेब पर उपलब्ध
- कुकी को समझना
- SameSite कुकी रेसिपी
- तेज़ विज्ञापन दिखाना ज़रूरी है
- उपयोगकर्ताओं को अपने साथ जोड़ने और उन्हें फिर से जोड़ने के लिए पुश नोटिफ़िकेशन का इस्तेमाल करें
- Notifications API का इस्तेमाल शुरू करना
- सूचनाओं को मैनेज करने के लिए सर्विस वर्कर का इस्तेमाल करना
- लेआउट के अस्थिरता को ठीक करना
- वेब ऐप्लिकेशन को तेज़ी से लोड करने की तकनीक, यहां तक कि फ़ीचर फ़ोन पर भी लोड होती है
- थंबर की मदद से इमेज ऑप्टिमाइज़ करें
- Houdini के नए एपीआई की मदद से बेहतर कस्टम प्रॉपर्टी
- प्रीफ़ेच करने के दो तरीके: <link> टैग और एचटीटीपी हेडर
- आने वाले समय में नेविगेशन की रफ़्तार बढ़ाने के लिए, संसाधनों को प्रीफ़ेच करें
- मिले-जुले कॉन्टेंट की समस्या ठीक करना
- मिला-जुला कॉन्टेंट क्या होता है?
- वेब के लिए बेसिक वीडियो की सुविधा के साथ इमेज से आगे बढ़ना
- अपने प्रोग्रेसिव वेब ऐप्लिकेशन में Apple टच आइकॉन जोड़ना
- रेडी प्लेयर वेब
- एक से ज़्यादा मूल साइटों में प्रोग्रेसिव वेब ऐप्लिकेशन
- वेब फ़ॉन्ट का साइज़ कम करें
- WebFont की लोडिंग और रेंडरिंग को ऑप्टिमाइज़ करें
- Angular सीएलआई की मदद से, प्रोग्रेसिव वेब ऐप्लिकेशन बनाएं
- इमेज को ऑप्टिमाइज़ करने के लिए, इमेज सीडीएन का इस्तेमाल करें
- तीसरे पक्ष की धीमी JavaScript की पहचान करना
- तीसरे पक्ष की JavaScript को बेहतर तरीके से लोड करना
- तीसरे पक्ष की JavaScript की परफ़ॉर्मेंस
- फ़ॉर्म के और बेहतर कंट्रोल
- तीसरे पक्ष का JavaScript ऑप्टिमाइज़ करना
- पेज स्पीड का अनुमान लगाने के लिए, पहले से इंटरनेट कनेक्शन का इस्तेमाल करें
- बैकड्रॉप फ़िल्टर का इस्तेमाल करके, ओएस-स्टाइल वाले बैकग्राउंड बनाएं
- फिर से पुष्टि करने के दौरान पुरानी जानकारी को अपडेट करना
- Angular सीडीके की मदद से, बड़ी सूचियों को वर्चुअल तरीके से इस्तेमाल करें
- Angular के बदलाव का पता लगाने की सुविधा ऑप्टिमाइज़ करें
- Angular में रूट को पहले से लोड करने की रणनीतियां
- अनुमानित प्रीफ़ेचिंग की मदद से तेज़ वेब नेविगेशन
- नेटवर्क की क्वालिटी के आधार पर, वीडियो को इमेज के हिसाब से बनाएं
- कोडलाइज़र की मदद से, अपने Angular ऐप्लिकेशन की सुलभता ऑडिट करें
- Angular CLI के साथ परफ़ॉर्मेंस बजट
- Angular सर्विस वर्कर के साथ प्रीकैशिंग
- prefers-color-scheme: नमस्ते, मेरे पुराने दोस्त
- ऐंगुलर में रूट-लेवल कोड का बंटवारा
- वेब की परफ़ॉर्मेंस के लिए सबसे सही सलाह
- शुरू करें: Angular ऐप्लिकेशन को ऑप्टिमाइज़ करें
- वेब कॉम्पोनेंट: वेब को बेहतर बनाने में मदद करने वाली सीक्रेट एलिमेंट
- परफ़ॉर्मेंस बजट के लिए लाइटहाउस का इस्तेमाल करें
- Web Payments API से जुड़े अपडेट
- स्पीड की वैल्यू
- डेस्कटॉप पर, प्रोग्रेसिव वेब ऐप्लिकेशन के लिए पता बार इंस्टॉल करना
- परफ़ॉर्मेंस से कन्वर्ज़न में कैसे सुधार हो सकता है?
- सर्विस वर्कर की मानसिकता
- PWA इंस्टॉलेशन के प्रमोशन के पैटर्न
- मैं उपयोगकर्ताओं को कैसे सूचना दूं कि मेरा PWA इंस्टॉल किया जा सकता है?
- तेज़ी से लोड होने में लगने वाले समय और अन्य चीज़ों के लिए इमेज नीतियां
- क्रिटिकल के साथ क्रिटिकल सीएसएस एक्सट्रैक्ट करें और इनलाइन करें
- ज़रूरी सीएसएस एक्सट्रैक्ट करें
- क्या लंबे JavaScript टास्क की वजह से इंटरैक्टिव में लगने वाला समय बढ़ रहा है?
- बड़े पैमाने पर स्पीड: वेब की परफ़ॉर्मेंस में नया क्या है?
- पेश है PROXX
- SameSite कुकी के बारे में बताया गया
- वेब पर्सेप्शन टूलकिट की मदद से विज़ुअल तरीके से खोज करना
- नेटवर्क की क्वालिटी के आधार पर, अडैप्टिव सर्विंग
- पोर्टल के साथ बेहतर तरीके से काम करें: वेब पर आसानी से नेविगेट करें
- Brotli की मदद से, नेटवर्क पेलोड को छोटा और कंप्रेस करें
- I/O 2019 में web.dev
- स्पीड को मापने का तरीका क्या है?
- तेज़ कैसे बने रहें?
- स्पीड क्या है?
- react-axe और eslint-plugin-jsx-a11y की मदद से सुलभता ऑडिट करना
- React.lazy और Suspense के साथ कोड बांटना
- शुरू करें: अपने React ऐप्लिकेशन को ऑप्टिमाइज़ करना
- रिएक्शन-स्नैप के साथ प्री-रेंडरिंग रूट
- Workbox की मदद से, React ऐप्लिकेशन बनाएं में प्रीकैशिंग
- Create React ऐप्लिकेशन की मदद से, वेब ऐप्लिकेशन मेनिफ़ेस्ट जोड़ना
- रिएक्शन विंडो की मदद से, बड़ी सूचियों को वर्चुअल तरीके से सेट करना
- कोडलैब (कोड बनाना सीखना): कॉन्टेंट लोड होने की स्पीड बढ़ाने के लिए, अहम एसेट को पहले से लोड करना
- befores-reduced-motion: कभी-कभी कम मूवमेंट ज़्यादा होता है
- गै़र-ज़रूरी सीएसएस को कुछ समय के लिए रोकें
- भरोसा अच्छा है और निगरानी करना बेहतर है: इंटरसेक्शन ऑब्ज़र्वर v2
- रिस्पॉन्सिव वेब डिज़ाइन से जुड़ी बुनियादी बातें
- बनाने लायक स्टाइलशीट
- वेब पर रेंडरिंग
- Trawis CI के साथ बंडलसाइज़ का इस्तेमाल करना
- अपनी बिल्ड प्रोसेस में परफ़ॉर्मेंस बजट शामिल करना
- Webpack की मदद से परफ़ॉर्मेंस बजट सेट करना
- परफ़ॉर्मेंस बजट सेट करने के लिए, Lighthouse बॉट का इस्तेमाल करना
- Emscripten और npm
- क्या आपका ऐप्लिकेशन इंस्टॉल किया गया है? getInstalledRelatedApps() आपको इसकी जानकारी देगा!
- तेज़ी से पेज लोड करने के लिए, मॉडर्न ब्राउज़र पर मॉडर्न कोड इस्तेमाल करें
- उपयोगकर्ताओं के हिसाब से क्लाइंट संकेतों के हिसाब से बदलाव करना
- स्टाइल फ़ोकस
- लेबल और टेक्स्ट के विकल्प
- टाइटल और लैंडमार्क
- Tabindex की मदद से फ़ोकस कंट्रोल करना
- सीमेंटिक और स्क्रीन रीडर
- सुलभता क्या है?
- कीबोर्ड को आसान बनाने के लिए सिमैंटिक एचटीएमएल इस्तेमाल करें
- कीबोर्ड ऐक्सेस करने से जुड़ी बुनियादी बातें
- Webpack के साथ Imagemin का इस्तेमाल करना
- वर्कबॉक्स: आपका हाई-लेवल सर्विस वर्कर टूलकिट
- एक जैसी ऑरिजिन नीति & फ़ेच करने के अनुरोध
- सुरक्षा इतनी डरावनी नहीं होनी चाहिए!
- कमांड लाइन के साथ WebP इमेज बनाना
- सर्विस वर्कर और कैश मेमोरी एपीआई
- कोड को बांटने की सुविधा की मदद से, JavaScript के पेलोड कम करें
- कला निर्देशन
- तेज़ी से पेज लोड करने के लिए, मॉडर्न ब्राउज़र पर मॉडर्न कोड इस्तेमाल करें
- पीआरपीएल पैटर्न के साथ झटपट लोड होने की सुविधा लागू करें
- कोड को बांटने की सुविधा की मदद से, JavaScript के पेलोड कम करें
- स्नीकी 404 कोड वाली गड़बड़ी ठीक करना
- क्रॉस-ऑरिजिन रिसॉर्स शेयरिंग (सीओआरएस)
- तेज़ी से पेज लोड करने के लिए, ऐनिमेशन वाले GIF की जगह वीडियो का इस्तेमाल करें
- सुरक्षा हमले क्या हैं?
- खोज की सुविधा कैसे काम करती है
- डेंसिटी डिस्क्रिप्टर का इस्तेमाल करें
- परफ़ॉर्मेंस बजट 101
- एक ही ऑरिजिन से जुड़ी नीति
- एचटीटीपी कैश मेमोरी में डेटा को कैश मेमोरी में सेव करने के तरीके को कॉन्फ़िगर करना
- स्लॉट की एक से ज़्यादा चौड़ाई तय करना
- सही डाइमेंशन वाली इमेज दिखाएं
- आपका पहला परफ़ॉर्मेंस बजट