▲ कम्युनिटी सेशन: Vercel CDN वॉकथ्रू

VVercel
Internet TechnologySmall Business/StartupsComputing/Software

Transcript

00:00:00नमस्ते सबको।
00:00:24इस हफ़्ते के Vercel कम्युनिटी लाइव सेशन में आपका स्वागत है।
00:00:27मैं एमी हूँ और आज मेरे साथ माया हैं।
00:00:31नमस्ते सबको।
00:00:32हम दोनों Vercel कम्युनिटी टीम में काम करते हैं।
00:00:35हम इसे X और YouTube पर लाइव स्ट्रीम कर रहे हैं,
00:00:37लेकिन अगर आप सवाल पूछना चाहते हैं,
00:00:39तो [community.vercel.com/live](https://community.vercel.com/live) पर ज़रूर साइन इन करें
00:00:43ताकि आप चैट में शामिल हो सकें और हम आपके सवाल देख सकें।
00:00:47बिल्कुल। अगर आप हमारी चैट में मौजूद हैं,
00:00:50तो बस एक छोटी सी याद दिला दूँ कि कृपया सम्मानजनक रहें,
00:00:52हमारे आचार संहिता (code of conduct) का पालन करें,
00:00:54और इसे सबके लिए एक अच्छा माहौल बनाने में हमारी मदद करें।
00:00:56तो आज का सेशन पूरी तरह से Vercel CDN के बारे में है।
00:01:00एक मज़ेदार बात, अगर आप इसे हमारे प्लेटफ़ॉर्म से देख रहे हैं,
00:01:04तो वह असल में Vercel CDN का ही उपयोग कर रहा है, जो बहुत दिलचस्प है।
00:01:07तो अगर आप इसके बारे में और जानना चाहते हैं,
00:01:10तो जैकब पेरिस, जो हमारी DX इंजीनियर टीम के साथी हैं,
00:01:13उन्होंने हाल ही में Vercel की वेबसाइट पर
00:01:15इसके कार्यान्वयन (implementation) के बारे में एक बेहतरीन ब्लॉग पोस्ट डाला है।
00:01:19>> मैंने चैट में लिंक डाल दिया है,
00:01:22तो अगर कोई इसे पढ़ना चाहता है, तो वह वहाँ उपलब्ध है।
00:01:25इसके अलावा, अगर आप ध्यान दे रहे हैं,
00:01:28तो हम अपने चैंजलॉग (changelog) में
00:01:30Vercel CDN से जुड़ी कई नई चीज़ें पेश कर रहे हैं।
00:01:33इसलिए हम उस टीम के लोगों को यहाँ बुलाना चाहते थे
00:01:35ताकि वे इसके बारे में विस्तार से बता सकें,
00:01:37और आपको उन सभी तरीक़ों की जानकारी दे सकें जिनसे हमने इसे बनाया है,
00:01:40आप इसे कैसे इस्तेमाल कर सकते हैं, और इसमें क्या-क्या फ़ीचर्स उपलब्ध हैं।
00:01:43तो चलिए मंच पर स्वागत करते हैं,
00:01:45मार्क, एंड्रयू और यश का, जो आपको इसके बारे में बताएँगे।
00:01:48अब हम आप लोगों के लिए मंच छोड़ते हैं।
00:01:51>> शुक्रिया, एमी और माया।
00:01:55नमस्ते सबको, मेरा नाम मार्क है।
00:01:57मैं CDN टीम में एक सॉफ्टवेयर इंजीनियर हूँ,
00:01:59और मैं यहाँ एंड्रयू और यश के साथ हूँ।
00:02:03मैं यहाँ Vercel के शानदार
00:02:06सैन फ्रांसिस्को ऑफिस में हूँ, कैलिफ़ोर्निया में इस हफ़्ते काफ़ी गर्मी है।
00:02:09आज, मैं उन नए CDN फ़ीचर्स के बारे में
00:02:12बात करना चाहता हूँ जिन पर हम काम कर रहे हैं।
00:02:15मैं इनके बारे में बताने के लिए काफ़ी उत्साहित हूँ।
00:02:18सबसे पहले, मैं Vercel CDN का थोड़ा परिचय देना चाहता हूँ।
00:02:21तो मैं इसके बारे में कुछ स्लाइड्स शेयर करने जा रहा हूँ,
00:02:25और फिर मैं एंड्रयू को बागडोर सौंप दूँगा,
00:02:27जो CDN डैशबोर्ड का डेमो दिखाना शुरू करेंगे।
00:02:32बहुत बढ़िया। मैं बस यह बताना चाहता हूँ कि Vercel CDN कैसे काम करता है।
00:02:39शायद आप न जानते हों, लेकिन Vercel पर तैनात (deploy) किया गया
00:02:42हर एक प्रोजेक्ट Vercel CDN का उपयोग करता है।
00:02:44यह आपको मुफ़्त में मिलता है।
00:02:46लेकिन यह एक ऐसी छिपी हुई चीज़ हो सकती है जिसके काम करने के तरीक़े के बारे में आपको पता न हो।
00:02:51तो Vercel CDN,
00:02:54यह आपके क्लाइंट, आपके ब्राउज़र,
00:02:56या आपकी मशीन से रिक्वेस्ट लेता है,
00:02:58और इसे एक 'पॉइंट ऑफ़ प्रेजेंस' (PoP) में भेजता है।
00:03:01ये पॉइंट ऑफ़ प्रेजेंस पूरी दुनिया में फैले हुए हैं।
00:03:03भौगोलिक रूप से पूरी दुनिया में हमारे 125 से ज़्यादा ऐसे केंद्र हैं।
00:03:07फिर यह एक Vercel क्षेत्र (region) में जाता है जहाँ हम TLS को समाप्त करते हैं,
00:03:14और फिर हम रिक्वेस्ट को हैंडल करते हैं।
00:03:16यही वह जगह है जहाँ हम कैशिंग (caching) करते हैं।
00:03:18हम रूटिंग (routing) भी यहीं करते हैं।
00:03:19अगर रिक्वेस्ट कैश में नहीं मिलती,
00:03:21तो हम इसे फ़ंक्शन क्षेत्र में भेज सकते हैं जहाँ हम
00:03:25इन्क्रीमेंटल स्टैटिक रीजनरेशन (ISR) जैसी चीज़ें कर सकते हैं।
00:03:29बाद में कैशिंग के बारे में बात करते समय मैं इस डायग्राम को और विस्तार से समझाऊँगा।
00:03:33इसके हिस्से के रूप में, आपको इनग्रेस (ingress) के साथ-साथ
00:03:35फ़ायरवॉल, रूटिंग और
00:03:38ट्रैफ़िक मैनेजमेंट फ़ीचर्स मिलते हैं जैसे स्क्यू प्रोटेक्शन (skew protection),
00:03:40रोलिंग रिलीज़, माइक्रो फ्रंट-एंड्स और बहुत कुछ।
00:03:44तो Vercel CDN में ऐसा क्या खास है?
00:03:49Vercel CDN फ़्रेमवर्क कोड को मूल रूप से (natively) समझता है।
00:03:52इसका मतलब यह है कि जब आप Vercel पर कोई प्रोजेक्ट तैनात करते हैं,
00:03:56तो आपका जो भी कोड और
00:03:57कॉन्फ़िगरेशन है, वह अपने आप उन आर्टिफ़ैक्ट्स में बदल जाता है
00:04:00जिन्हें Vercel CDN सीधे प्रोसेस करता है।
00:04:04ज़्यादातर अन्य CDN में आपको इसे खुद कॉन्फ़िगर करना पड़ता है।
00:04:07लेकिन अगर आप किसी फ़्रेमवर्क का उपयोग कर रहे हैं, तो यह आपको पहले से तैयार मिलता है।
00:04:10आपको इसमें पहले से मौजूद रिक्वेस्ट एक्सीलरेशन
00:04:13और हाई अवेलेबिलिटी (high availability) मिलती है जिसके बारे में मैंने पहले बताया था।
00:04:16आपको ISR जैसा फ़ीचर भी मिलता है,
00:04:19यानी इन्क्रीमेंटल स्टैटिक रीजनरेशन।
00:04:21यह हमारी प्राथमिकता है,
00:04:23इसका मतलब है कि आप अपने कोड को दोबारा तैनात किए बिना ही
00:04:27पेजों को फिर से जनरेट कर सकते हैं, बस एक
00:04:29API रिक्वेस्ट या वेबहुक भेजकर विशिष्ट पेजों को टारगेट किया जा सकता है।
00:04:34इसके अलावा, आपको हर प्रोजेक्ट के लिए
00:04:36अनमीटर्ड और हमेशा चालू रहने वाला DDoS इंटीग्रेशन मिलता है।
00:04:40यह मुफ़्त है और सभी एप्लिकेशन पर खतरों को लगातार संभालता है,” साथ ही इसमें
00:04:46कॉन्फ़िगर करने योग्य वेब एप्लिकेशन फ़ायरवॉल और बॉट मैनेजमेंट भी मिलता है।
00:04:51पिछले कुछ महीनों में,
00:04:53हमने कई नए फ़ीचर्स पर काम किया है जो
00:04:56Vercel डैशबोर्ड के अंदर उपलब्ध हैं,
00:05:00और आज हम उन फ़ीचर्स का जायज़ा लेंगे।
00:05:02इन फ़ीचर्स में एक बिल्कुल नया CDN डैशबोर्ड अनुभव,
00:05:06बिना किसी नए डिप्लॉयमेंट के प्रोजेक्ट लेवल पर
00:05:09रूटिंग नियम (routing rules) परिभाषित करने की क्षमता,
00:05:12एक बिल्कुल नया कैशिंग टैब,
00:05:13और 10 लाख तक रीडायरेक्ट सेट करने की सुविधा शामिल है।
00:05:18अब इसके साथ, मैं एंड्रयू को मंच सौंपता हूँ,
00:05:22जो CDN डैशबोर्ड के बारे में बताएँगे। एंड्रयू?
00:05:27>> शुक्रिया, मार्क। धन्यवाद।
00:05:29नमस्ते सबको, मैं एंड्रयू गैज़ेक हूँ।
00:05:31जैसा कि आप देख ही सकते हैं, मैं CDN टीम में एक सॉफ्टवेयर इंजीनियर हूँ।
00:05:36मैं न्यू हैम्पशायर में रहता हूँ।
00:05:38आज यहाँ तापमान करीब 35 डिग्री है और धूप खिली है, फिर भी काफी ठंड है।
00:05:45मुझे जल्द ही आने वाले गर्मियों के दिनों का इंतज़ार है।
00:05:49आज, मैं अपनी स्क्रीन शेयर करने जा रहा हूँ,
00:05:53और मैं आपको एक छोटा डेमो ऐप दिखाऊँगा जो हमने
00:05:56आज के कम्युनिटी सेशन के लिए बनाया है।
00:05:59हमारे पास यह Next.js ऐप है।
00:06:02इसमें ब्लॉग के लिए कई सारे रूट्स (routes) हैं।
00:06:08हम एक डैशबोर्ड देख सकते हैं।
00:06:10इसमें एक API रूट भी है जो डेटा वापस भेजता है, इत्यादि।
00:06:16लेकिन हम यहाँ इसके लिए नहीं आए हैं।
00:06:18हम यहाँ डैशबोर्ड में हुए बदलावों को देखने आए हैं।
00:06:22जब आप Vercel डैशबोर्ड में होंगे,
00:06:25तो आप देखेंगे कि यहाँ एक नया CDN टैब है।
00:06:28अगर आप उस पर क्लिक करते हैं,
00:06:30तो यह आपको इस ओवरव्यू पेज पर ले जाता है जहाँ हम
00:06:35उन सभी Vercel क्षेत्रों की सूची दिखाते हैं जो
00:06:39निर्धारित समय अवधि में आपके प्रोजेक्ट को सर्व कर रहे हैं।
00:06:45यहाँ हमारे पास पिछले 12 घंटों का डेटा है।
00:06:47हम देख सकते हैं कि सैन फ्रांसिस्को और वाशिंगटन
00:06:49से ट्रैफ़िक हमारी साइट पर आ रहा है।
00:06:52ज़्यादा जानकारी देखने के लिए आप इन पर होवर कर सकते हैं।
00:06:55आप ऑब्जर्वेबिलिटी (observability) खोल सकते हैं
00:06:58ताकि ट्रैफ़िक डेटा की गहराई से जाँच की जा सके।
00:07:04इस पेज की एक अच्छी बात यह है कि आप 3D मैप देख सकते हैं,
00:07:08वापस 2D मैप पर जा सकते हैं,
00:07:10और यहाँ और भी ऑब्जर्वेबिलिटी डेटा देख सकते हैं,
00:07:17जो आपको विशिष्ट ऑब्जर्वेबिलिटी पेजों पर वापस ले जाता है।
00:07:22तो यह है ओवरव्यू पेज।
00:07:27इसका उद्देश्य बस आपको अपने प्रोजेक्ट के ट्रैफ़िक की
00:07:30एक झलक दिखाना है और साथ ही
00:07:35यह दिखाना है कि आपके फ़ंक्शंस कहाँ स्थित हैं।
00:07:38आप देख सकते हैं कि इस प्रोजेक्ट का फ़ंक्शन क्षेत्र वाशिंगटन है।
00:07:44अगली चीज़ जिसका मैं डेमो देना चाहता हूँ, वह है रीडायरेक्ट।
00:07:48बल्क रीडायरेक्ट, माफ़ कीजिएगा।
00:07:52ओह नहीं, यह होने की ही उम्मीद थी।
00:08:00चलिए देखते हैं। क्या मैं यहाँ कोई दूसरा प्रोजेक्ट आज़मा सकता हूँ।
00:08:07ठीक है। चलिए एक दूसरा प्रोजेक्ट आज़माते हैं।
00:08:18असुविधा के लिए खेद है।
00:08:22तो हमारे पास यह बल्क रीडायरेक्ट प्रोजेक्ट है।
00:08:27चलिए इसमें कुछ रीडायरेक्ट जोड़ते हैं।
00:08:30तो रीडायरेक्ट बनाने के लिए,
00:08:35आप इस पेज पर आएं और "Manual" पर क्लिक करें।
00:08:37अब मान लीजिए कि मैं चाहता हूँ कि /demo यहाँ जाए,
00:08:44चलिए देखते हैं, /about/blog/2020,
00:08:5110/style, बस यह पक्का कर लूँ, कुछ इस तरह।
00:08:57तो आप "Create" पर क्लिक करें, यह बैकग्राउंड में बन जाता है,
00:09:02और फिर यह "Review Changes" का मॉडल सामने लाएगा।
00:09:07अभी ये बदलाव प्रोडक्शन में लाइव नहीं हुए हैं।
00:09:11वे एक स्टेजिंग वातावरण (staging environment) में हैं,
00:09:13और आप इससे नए रीडायरेक्ट का परीक्षण कर सकते हैं।
00:09:18यहाँ क्लिक करें, और यह पेज अभी मौजूद नहीं है।
00:09:24लेकिन हाँ, यह इसी तरह काम करता है।
00:09:27फिर अगर आप इसे प्रोडक्शन में पब्लिश करना चाहते हैं, तो "Publish" पर क्लिक करें।
00:09:30अगर आप इसे स्टेजिंग में रखना चाहते हैं, तो "Cancel" पर क्लिक करें,
00:09:34और फिर आप यहाँ स्टेजिंग बदलाव देख सकते हैं जहाँ हमने वह किया था।
00:09:39अगर हम इसे प्रोडक्शन में पब्लिश कर देते,
00:09:42तो ये बदलाव (स्टेजिंग से) चले जाते।
00:09:45हमें इसे प्रोडक्शन में देखना चाहिए।
00:09:58अब आप सर्च कर सकते हैं।
00:10:01आप अपनी हिस्ट्री देख सकते हैं।
00:10:05आप लाइव बदलावों की तुलना पिछले बदलावों से कर सकते हैं,
00:10:14और अगर आप चाहें तो इस वर्ज़न को रिस्टोर (restore) भी कर सकते हैं।
00:10:17"Restore" पर क्लिक करें, और हम देखेंगे कि 'demo' अब मौजूद नहीं है।
00:10:26शानदार। बहुत बढ़िया। अब मैं यश को उनके डेमो के लिए आमंत्रित करता हूँ।
00:10:34>> शुक्रिया, एंड्रयू। नमस्ते सबको।
00:10:38मेरा नाम यश है। मैं CDN टीम में एक इंजीनियरिंग इंटर्न हूँ,
00:10:42और मैं भी सैन फ्रांसिस्को मुख्यालय में ही स्थित हूँ।
00:10:55मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को का छात्र हूँ।
00:10:58मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न हूँ।
00:11:03मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:08मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:14मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:18मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:23मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:26मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:32मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:37मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:41मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:46मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:50मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:11:57मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:02मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:07मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:13मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:17मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:22मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:27मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:32मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:37मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:41मैं यूनिवर्सिटी ऑफ़ कैलिफ़ोर्निया सैन फ्रांसिस्को में इंजीनियरिंग इंटर्न भी हूँ।
00:12:45अगर हमें यही चीज़ कोड में करनी होती, तो हमें अपना प्रोजेक्ट दोबारा डिप्लॉय करना पड़ता।
00:12:49लेकिन अब यह तुरंत हो जाता है।
00:12:53अब मैं एक दूसरा रूट बनाने जा रहा हूँ। यह थोड़ा ज़्यादा जटिल होगा।
00:12:56पिछली बार की तरह फ़ॉर्म भरने के बजाय, मैं यहाँ वह टाइप करूँगा जो मुझे चाहिए।
00:13:00हम रूट जनरेट करने के लिए AI का उपयोग करेंगे।
00:13:02तो मेरे पास एक डैशबोर्ड है, और मैं वर्ज़न 2 बना रहा हूँ, जिसे मैं धीरे-धीरे केवल बीटा यूज़र्स के लिए रोल आउट करना चाहता हूँ।
00:13:08इसलिए मैं अपने डैशबोर्ड को डैशबोर्ड के वर्ज़न 2 पर रीराइट (rewrite) कर सकता हूँ।
00:13:14चलिए देखते हैं कि क्या उपयोगकर्ता के पास बीटा कुकी है जो 'ट्रू' पर सेट है।
00:13:21अब हम नियम जनरेट कर सकते हैं, और कुछ ही सेकंड में AI हमारे लिए फ़ॉर्म भर देगा।
00:13:27तो हम अपने द्वारा बनाए गए नियम को देख सकते हैं। यह 'डैशबोर्ड' को 'डैशबोर्ड v2' पर रीराइट कर रहा है।
00:13:32इसका मतलब यह है कि उपयोगकर्ता को अभी भी अपने URL में 'स्लैश डैशबोर्ड' ही दिखाई देगा,
00:13:35लेकिन उन्हें नए डैशबोर्ड का नया कंटेंट दिखाया जाएगा।
00:13:39और यहाँ यह शर्त दी गई है। इसका मतलब है कि रीराइटिंग नियम तभी लागू होगा
00:13:43जब उपयोगकर्ता के पास 'बीटा' नाम की कुकी हो जो 'ट्रू' के बराबर हो।
00:13:46तो अगर उनके पास यह कुकी है, तो वे नया डैशबोर्ड देखेंगे, वरना उन्हें पुराना डैशबोर्ड दिखेगा।
00:13:53और फिर से हम इसे बहुत जल्दी टेस्ट कर सकते हैं।
00:13:58तो यह पुराना डैशबोर्ड है, लेकिन अब अगर हम 'बीटा' नाम की कुकी को 'ट्रू' पर सेट करते हैं,
00:14:09और रिफ्रेश करते हैं, तो हम नया डैशबोर्ड देख सकते हैं, लेकिन हमारा URL अभी भी 'स्लैश डैशबोर्ड' ही है न कि 'स्लैश डैशबोर्ड स्लैश v2'।
00:14:16ऐसा इसलिए है क्योंकि हमने रीडायरेक्ट के बजाय रीराइट का इस्तेमाल किया है, और अब हम इसे पब्लिश कर सकते हैं।
00:14:22और अब आखिरी राइटिंग नियम जो मैं आपको दिखाना चाहता हूँ, वह कैशिंग हेडर्स से संबंधित है।
00:14:26तो यह कुछ ऐसा है जिसे आप अपनी साइट की परफॉरमेंस बेहतर बनाने के लिए सेट कर सकते हैं,
00:14:30और खास तौर पर मैं अपनी स्टैटिक इमेजेस को ऑप्टिमाइज़ करना चाहता हूँ।
00:14:33तो मैं कह सकता हूँ कि हम अपनी स्टैटिक इमेजेस के लिए कैशिंग को ऑप्टिमाइज़ करना चाहते हैं,
00:14:41हमारी इमेजेस के लिए 'कैश कंट्रोल हेडर' को 'पब्लिक मैक्स-एज' एक साल के लिए 'इम्यूटेबल' सेट कर दें।
00:14:52और फिर से, हम AI के साथ नियम जनरेट कर सकते हैं।
00:14:55और अब हम यह नियम बनाते हैं जो सभी इमेजेस के लिए एक साल का कैश सेट कर देगा।
00:14:59तो इमेज लेने के लिए हर बार ब्राउज़र को आपके सर्वर पर जाने के बजाय,
00:15:03यह इसे लोकली लेने की कोशिश करेगा और इससे आपकी परफॉरमेंस बेहतर हो सकती है और लागत बच सकती है।
00:15:08ऐसी कई अन्य वैल्यूज़ हैं जिन पर आप कैश कंट्रोल हेडर सेट कर सकते हैं,
00:15:11लेकिन मुझे लगता है कि स्टैटिक एसेट्स के लिए यह सबसे अच्छा है।
00:15:14तो आप इसे फिर से क्रिएट करके रूट पब्लिश कर सकते हैं।
00:15:19और जैसा कि मैंने पहले बताया, इन सभी रूट्स को कोड में भी डिफाइन किया जा सकता है।
00:15:23और हमारे पास यहाँ यह मॉडल है जहाँ आप
00:15:26डैशबोर्ड के अपने सभी रूट्स को ऐसी चीज़ में बदल सकते हैं जिसे आप कॉपी करके पेस्ट कर सकें
00:15:30चाहे वह Vercel.json हो या Vercel.ts, जो भी आप चाहें।
00:15:35इन्हें अपने कोड में रखने का मुख्य लाभ बेहतर वर्शन कंट्रोल प्रैक्टिस है,
00:15:40लेकिन अगर आप यहाँ बदलाव करते हैं तो ध्यान रखें कि उन्हें लाइव करने के लिए आपको अपना प्रोजेक्ट फिर से डिप्लॉय करना होगा।
00:15:46और दूसरी चीज़ जो मैं आपको दिखाना चाहता हूँ वह है हिस्ट्री पेज।
00:15:49यह वैसा ही है जैसा एंड्रयू ने 'बल्क रीडायरेक्ट्स' पेज में डेमो दिया था।
00:15:52आप देख सकते हैं कि पिछले वर्शन्स में क्या बदला है।
00:15:55और मान लीजिए कि हम अपने सबसे हालिया बदलाव को अनडू करना चाहते हैं जो कैशिंग नियम जोड़ना था।
00:16:00हम बस इस रिस्टोर बटन को दबाकर इसे तुरंत पहले जैसा कर सकते हैं।
00:16:04और अब लगभग तुरंत ही वह नियम हट जाएगा, हम देख सकते हैं कि यह अब यहाँ नहीं है।
00:16:09आप सर्च भी कर सकते हैं और टाइप के अनुसार फ़िल्टर कर सकते हैं, जैसे अगर आप अपने सभी रीडायरेक्ट देखना चाहते हैं।
00:16:14और हाँ, यही प्रोजेक्ट राइटिंग है।
00:16:16मैंने जो भी फीचर्स डेमो किए हैं, वे API, CLI और SDK के माध्यम से भी उपलब्ध हैं।
00:16:22बहुत-बहुत धन्यवाद, अब मैं मार्क को हैंडओवर करता हूँ।
00:16:26बढ़िया, शुक्रिया यश, वह वाकई बहुत अच्छा था।
00:16:29मुझे नेचुरल लैंग्वेज वाला फीचर पसंद आया।
00:16:31तो मैं नए CDN टैब्स का आखिरी फीचर दिखाने जा रहा हूँ जो कि कैशिंग टैब है।
00:16:41तो जैसा कि यश बात कर रहे थे जहाँ आप कैश कंट्रोल हेडर सेट कर सकते हैं,
00:16:46Vercel CDN में डिफ़ॉल्ट रूप से आपको कैशिंग मुफ़्त मिलती है जब आप इंक्रीमेंटल
00:16:53स्टैटिक रीजनरेशन जैसे फीचर्स का उपयोग करते हैं या आप खुद कैश हेडर्स को कंट्रोल कर सकते हैं।
00:16:56तो यहाँ टॉप पर 'कैश' टैब में हमारे पास यह कैशिंग डायग्राम है।
00:17:04मैं इसे समझाने में थोड़ा समय बिताना चाहता हूँ क्योंकि अन्य CDN के विपरीत यहाँ वास्तव में
00:17:09कई टियर्स (tiers) हैं जो आपकी साइट को ऑप्टिमाइज़ करने में मदद करते हैं।
00:17:12तो अगर आप ISR का उपयोग कर रहे हैं, तो यह वही डायग्राम है जो हमने पहले देखा था।
00:17:17रिक्वेस्ट क्लाइंट के बहुत करीब से इनग्रेस (ingress) होती है।
00:17:20यह सबसे नजदीकी Vercel रीजन को पास होती है।
00:17:22दुनिया भर में 20 रीजन हैं जहाँ इसे CDN कैश के साथ मैप किया जाता है।
00:17:27अगर यहाँ 'मिस' होता है, तो यह आपके फंक्शन रीजन में जा सकता है जहाँ आपके ISR के लिए एक और कैश है
00:17:33और अगर फंक्शन को एग्जीक्यूट करने की ज़रूरत है, तो एक और कैश है जिसका उपयोग आप
00:17:39अपने बैकएंड से डेटा रिक्वेस्ट करने के लिए कर सकते हैं ताकि आप अपने बैकएंड को प्रोटेक्ट कर सकें।
00:17:43ऐसे अलग-अलग प्रकार के रिक्वेस्ट हैं जो आप Vercel पर कर सकते हैं।
00:17:47उदाहरण के लिए, अगर आप सिर्फ एक API रिक्वेस्ट कर रहे हैं और कैश कंट्रोल हेडर्स का उपयोग कर रहे हैं,
00:17:52डॉक्यूमेंटेशन पर क्लिक करें, यहाँ यह CDN कैश का भी उपयोग करता है।
00:17:56यह ISR कैश को छोड़ देता है लेकिन इसमें अभी भी फंक्शन और रनटाइम कैश होता है।
00:18:00और आखिरी बात, अगर आप Vercel CDN पर किसी एक्सटर्नल ओरिजिन को रीराइट कर रहे हैं,
00:18:07मान लीजिए कि आप Vercel बैकएंड पर प्रॉक्सी कर रहे हैं, तो आपको Vercel CDN फीचर्स जैसे
00:18:14कैश और फ़ायरवॉल का लाभ मिलता है लेकिन फिर रिक्वेस्ट एक्सटर्नल ओरिजिन पर जाएगी।
00:18:18और यह हमें 'पर्ज कैश' (purge cache) फंक्शनलिटी की ओर ले जाता है।
00:18:22तो मान लीजिए कि किसी कारण से आप कंटेंट को रीवैलिडेट (revalidate) करना चाहते हैं।
00:18:26यहाँ इस पेज पर मेरे पास ISR का एक उदाहरण है जिसमें एक विशिष्ट कैश टैग के साथ फेच (fetch) का उपयोग किया गया है।
00:18:36तो यहाँ इसे 'फेच डेटा टैग' कहा गया है।
00:18:38आप यहाँ देख सकते हैं कि इसे लगभग एक घंटे पहले रीजनरेट किया गया था और यह फेच डेटा कैश टैग का उपयोग कर रहा है।
00:18:45अगर मैं उसे पर्ज करना चाहता हूँ, मान लीजिए कि मैं चाहता हूँ कि वह पेज रीजनरेट हो, तो मेरे पास कुछ विकल्प हैं।
00:18:54यहाँ मैं कैश टैग के द्वारा पर्ज कर सकता हूँ इसलिए मैं 'फेच डेटा' टैग डाल सकता हूँ।
00:18:58और फिर मैं कंटेंट को इनवैलिडेट (invalidate) करने या कंटेंट को डिलीट करने में से चुन सकता हूँ।
00:19:04इनवैलिडेट हमें एक 'स्टेल' (पुराना) पेज सर्व करने की अनुमति देता है जबकि वह पेज बैकग्राउंड में
00:19:09रीजनरेट हो रहा होता है, इसलिए यूजर्स के लिए इसकी सिफारिश की जाती है ताकि आपको अगले रिक्वेस्ट पर
00:19:14लेटेंसी (latency) का सामना न करना पड़े।
00:19:16तो मान लीजिए कि मैं ऐसा करता हूँ, मैं पर्ज पर क्लिक करता हूँ, हाँ मुझे पर्ज करना है।
00:19:21जब मैं पेज को रिफ्रेश करता हूँ, तो इस बार समय नहीं बदला, यह अभी भी बढ़ रहा है।
00:19:27लेकिन अगर मैं पेज को फिर से रिफ्रेश करता हूँ, तो आप देख सकते हैं कि समय वापस रीसेट हो गया, यह अभी ताज़ा
00:19:33रीजनरेट हुआ था।
00:19:34मैं कंटेंट डिलीट करते समय भी यही चीज़ कर सकता हूँ।
00:19:39तो अगर मैं इस कंटेंट को डिलीट करता हूँ और पर्ज पर क्लिक करता हूँ, तो अगली बार जब मैं इस पेज को रिफ्रेश करूँगा
00:19:45तो आप देखेंगे कि समय तुरंत वापस रीसेट हो गया है।
00:19:48ऐसा इसलिए हुआ क्योंकि यह 'ब्लॉकिंग रीवैलिडेट' जैसा था, अगले रिक्वेस्ट ने पेज को सर्व करने से पहले
00:19:53रीजनरेट होने का इंतज़ार किया।
00:19:55इसलिए हम कंटेंट रिफ्रेश करने के लिए 'इनवैलिडेट' का उपयोग करने की सलाह देते हैं क्योंकि यह
00:20:00स्टेल कंटेंट सर्व कर सकता है जबकि यह बैकग्राउंड में रीजनरेट हो रहा हो।
00:20:05आप कैश टैग के द्वारा पर्ज कर सकते हैं, आप उसी तरह से सोर्स इमेज के द्वारा भी पर्ज कर सकते हैं।
00:20:11आप कैश के सभी कंटेंट को भी पर्ज कर सकते हैं और आप उन दो लेयर्स पर ऐसा कर सकते हैं
00:20:16जिन पर हम पहले चर्चा कर रहे थे, या तो CDN कैश पर या रनटाइम या डेटा कैश पर।
00:20:21और यह सभी कंटेंट को पर्ज कर देता है यानी यह पूरे कंटेंट को डिलीट कर देता है ताकि अगला रिक्वेस्ट
00:20:28ब्लॉक हो जाए और उस कंटेंट को रिफ्रेश करे।
00:20:30तो आज के नए फीचर्स पर हमारे पास बस इतना ही था और अब हम सवालों के लिए सेशन शुरू करेंगे
00:20:39और हमें बताएँ कि आप क्या जानना चाहते हैं।
00:20:43ठीक है, धन्यवाद।
00:20:44हे दोस्तों, चैट में हमारे पास कुछ सवाल हैं।
00:20:50मैं पहले वाले से शुरू करूँगा।
00:20:51एक Vercel ऐप डिप्लॉय करने के बाद, मैं CDN का उपयोग कैसे करूँ और आप इसके लिए कितना चार्ज करते हैं?
00:21:10हाँ, बहुत अच्छा सवाल है।
00:21:11हर Vercel एप्लिकेशन को CDN मुफ़्त में मिलता है और इसका मतलब है कि जब आप अपना
00:21:20एप्लिकेशन डिप्लॉय करते हैं, तो हम स्वचालित रूप से इसके कंटेंट को देखते हैं और फिर इसे
00:21:27Vercel CDN पर सर्व करने के लिए ऑप्टिमाइज़ करते हैं।
00:21:28अगर आप किसी ऐसे फ्रेमवर्क का उपयोग कर रहे हैं जो ISR को सपोर्ट करता है, तो हम उस SSG यानी स्टैटिक साइट जनरेशन को
00:21:35चलाएंगे और उस कंटेंट को ISR कैश और CDN कैश में मैप करेंगे।
00:21:40तो शुरुआत करने के लिए शायद आपको सब कुछ कॉन्फ़िगर करने की ज़रूरत नहीं है।
00:21:46हालांकि, अगर आप चाहें तो बिल्कुल कर सकते हैं, उदाहरण के लिए अगर आप एक API रिक्वेस्ट डिफाइन कर रहे हैं
00:21:53तो आप उसे कस्टमाइज़ करने के लिए कैश कंट्रोल हेडर्स सेट कर सकते हैं, या जैसा यश ने दिखाया
00:22:00कि अगर आप स्टैंडर्ड डायरेक्टरी के अलावा किसी दूसरी डायरेक्टरी से स्टैटिक कंटेंट सर्व कर रहे हैं
00:22:07तो आप उन सभी कंटेंट के लिए कैशिंग नियम सेट कर सकते हैं।
00:22:11हॉबी यूजर्स के लिए यह मुफ्त दिया जाता है और प्रो यूजर्स के लिए आपको रिक्वेस्ट और
00:22:21बैंडविड्थ का एक कोटा मिलता है और उसके बाद रीजन के आधार पर कुछ रेट्स लागू होते हैं जिन्हें
00:22:26आप हमारी साइट पर देख सकते हैं।
00:22:27दूसरा सवाल।
00:22:31क्या होगा अगर मेरे ऐप के सामने पहले से ही कोई CDN है?
00:22:38मैं इसे Vercel पर कैसे स्विच करूँ?
00:22:40यह भी बहुत अच्छा सवाल है।
00:22:44यह ऐसी चीज़ है जिसे हम पूरी तरह से सपोर्ट कर सकते हैं।
00:22:47तो माइग्रेट करने के लिए मुझे लगता है कि दो स्टेज हो सकते हैं।
00:22:54पहला यह है कि अगर आप Vercel के सामने पहले से ही एक CDN का उपयोग कर रहे हैं, तो आप बस
00:22:58कंटेंट को पास होने दें ताकि Vercel कैशिंग और सर्विंग को संभाल सके और फिर एक बार जब आपके पास
00:23:04वह हो जाए और राउटिंग नियम भी हों, तो जब आपके पास Vercel पर वह सारा कॉन्फ़िगरेशन हो जाए
00:23:10तब आपको बस अपना DNS बदलकर Vercel की ओर पॉइंट करना होगा ताकि
00:23:15रिक्वेस्ट अपने आप Vercel पर आने लगें।
00:23:18हमारे पास एक गाइड है जिसका लिंक हम कमेंट्स में दे सकते हैं कि कैसे आप बिना किसी डाउनटाइम के
00:23:23Vercel के DNS पर माइग्रेट कर सकते हैं।
00:23:25अगर आपके मन में कॉन्फ़िगरेशन के अंतर के बारे में सवाल हैं, तो हमारे नॉलेज बेस में कुछ गाइड्स हैं
00:23:33जो अन्य CDNs के अलग-अलग कॉन्सेप्ट्स को Vercel कॉन्सेप्ट्स के साथ
00:23:37मैप करने में मदद करती हैं, तो हम उनके लिए भी कुछ लिंक्स दे सकते हैं।
00:23:41शायद मैं यह सवाल एंड्रयू की ओर बढ़ा दूँ।
00:23:49मैं अपने CDN ट्रैफिक का विश्लेषण कैसे कर सकता हूँ?
00:23:52हाँ, इसके कुछ तरीके हैं।
00:23:55पहला तरीका जो मैंने डेमो दिया था।
00:24:00क्या आप मुझे नहीं सुन पा रहे हैं?
00:24:00हाँ, ठीक है शुक्रिया।
00:24:04तो पहला तरीका जो मैंने पहले दिखाया था, आप CDN ओवरव्यू टैब देख सकते हैं जो आपको
00:24:11दिए गए समय के लिए Vercel CDN पर आपके प्रोजेक्ट के ट्रैफिक का एक स्नैपशॉट दिखाता है।
00:24:17एक और जगह जहाँ आप जा सकते हैं वह है 'ऑब्जर्वैबिलिटी एज रिक्वेस्ट' पेज, और आप अपने सभी ट्रैफिक को
00:24:24अलग-अलग कैटेगरी में बाँट कर देख सकते हैं।
00:24:34हाँ, और Vercel के ऑब्जर्वैबिलिटी पेज पर बहुत सारे रिच ब्रेकडाउन उपलब्ध हैं जिन्हें
00:24:44आप देख सकते हैं, तो बेझिझक उस पर और जानकारी लेते रहें।
00:24:48एक और सवाल जो मैं अक्सर उठता हुआ देखता हूँ, वह यह है कि क्या CDN DDoS हमलों को संभालता है या
00:24:57CDN के साथ किस तरह की सुरक्षा जोड़ी जाती है या उपलब्ध है?
00:25:04हाँ, बहुत ही शानदार सवाल है।
00:25:06Vercel डिफ़ॉल्ट रूप से DDoS मिटिगेशन के लिए अनमीटर्ड प्रोटेक्शन के साथ आता है।
00:25:12इसका मतलब यह है कि यह मुफ्त मिलता है और इसमें अलग-अलग प्रकार के
00:25:19हमलों की एक विस्तृत श्रृंखला शामिल है जिनसे Vercel आपको पहले से ही सुरक्षित रखता है।
00:25:23तो हमारे पास एक वेब एप्लिकेशन फ़ायरवॉल है और हमारे पास L3, L4 और L7 प्रोटेक्शन भी हैं ताकि
00:25:32किसी खास पाथ पर रिक्वेस्ट की अचानक बढ़ोतरी से लेकर अधिक जटिल
00:25:39हमलों तक, जो IP एड्रेस या अन्य जानकारी बदलते रहते हैं, हम उन्हें पहचान सकें और आपकी
00:25:47रक्षा कर सकें।
00:25:48तो हाँ, बिल्कुल, यह सभी प्रोजेक्ट्स के लिए डिफ़ॉल्ट रूप से आता है।
00:25:52अगर आप चाहें तो कस्टम नियम भी डिफाइन कर सकते हैं।
00:25:57यह डैशबोर्ड में फ़ायरवॉल टैब में उपलब्ध है, यह एक ऐसा विषय है जिस पर हमें
00:26:02जल्द ही एक सेशन ज़रूर करना चाहिए।
00:26:04और वहाँ आप अपने एप्लिकेशन के लिए और भी विशिष्ट नियम डिफाइन कर सकते हैं अगर कोई
00:26:09खास चीज़ है जिसे आप ब्लॉक करना चाहते हैं।
00:26:13सुरक्षा निश्चित रूप से एक बड़ा विषय है, आप इस पर पूरा एक सेशन कर सकते हैं।
00:26:22हाँ, मुझे वह सब बहुत पसंद है जो आप लोग इन सभी अलग-अलग फ्लोज़ में
00:26:27रुकावटों को कम करने के लिए कर रहे हैं।
00:26:29और वास्तव में मुझे थोड़ा अजीब सा सवाल याद आया, मैंने ट्विटर पर देखा था कि लोग
00:26:34CDN पेज पर 2D से 3D एनिमेशन को बहुत पसंद कर रहे थे।
00:26:38क्या आप हमें वह दिखा सकते हैं और शायद उस पर कुछ और कहना चाहेंगे?
00:26:42हाँ, मैं अपनी स्क्रीन फिर से शेयर कर सकता हूँ।
00:26:49चलिए देखते हैं, उन लोगों के लिए जिन्होंने इसे नहीं देखा है।
00:26:52हाँ, तो CDN ओवरव्यू पेज पर हम एक 2D मैप दिखाते हैं और अगर आप ग्लोब पर क्लिक करते हैं तो आपको
00:27:00एक 3D मैप मिलता है।
00:27:01अब यह काफी इंटरैक्टिव है, आप इसे अपनी पसंद के अनुसार किसी भी तरफ घुमा सकते हैं।
00:27:07आप होवर कर सकते हैं और वापस ट्रांज़िशन कर सकते हैं।
00:27:12तो हाँ, बस यही है।
00:27:18शुक्रिया।
00:27:19मुझे यह ग्राफ़िक बहुत पसंद आया और मुझे यह पसंद है कि यह ऑब्जर्वैबिलिटी वाले हिस्से में
00:27:24जाना कितना आसान बना देता है, जहाँ जैसे मैं देख सकता हूँ कि ट्रैफिक कहाँ है और फिर मैं
00:27:29गहराई से उसकी जाँच कर सकता हूँ।
00:27:30बिल्कुल।
00:27:32एक और सवाल उन समस्याओं से जुड़ा है जो मैंने लोगों को इन फीचर्स के जुड़ने से पहले
00:27:43झेलते हुए देखा है और यह कुछ ऐसा भी है जो मैं खुद भी जानना चाहता हूँ क्योंकि मैंने
00:27:47अभी तक इस सब नई चीज़ों को गहराई से नहीं देखा है।
00:27:50यह सब इतना नया है।
00:27:51गलत कॉन्फ़िगरेशन को रोकने या पहचानने के लिए क्या सुरक्षा उपाय हैं,
00:27:58या आम तौर पर किसी इंटरनल सर्विस या सेंसिटिव डेटा को अनजाने में सार्वजनिक होने से बचाने के लिए,
00:28:03जिसे आप नहीं चाहते कि कोई और देखे?
00:28:04हाँ, निश्चित रूप से।
00:28:07तो इंटरनल रूट्स को छिपाने के लिए कई अलग-अलग प्रकार के प्रोटेक्शन हैं।
00:28:15डिफ़ॉल्ट रूप से प्रोजेक्ट्स में 'डिप्लॉयमेंट प्रोटेक्शन' होता है जो आपको Vercel ऑथेंटिकेशन
00:28:23या पासवर्ड का उपयोग करके अपनी साइट को अवांछित विजिटर्स से सुरक्षित रखने की अनुमति देता है और यह पूरे डिप्लॉयमेंट को प्रोटेक्ट कर सकता है।
00:28:31इसके अलावा, आप किसी खास रूट को प्रोटेक्ट करने के लिए
00:28:43कुकीज़ और ऑथेंटिकेशन लाइब्रेरीज़ का भी उपयोग कर सकते हैं।
00:28:46कस्टम फ़ायरवॉल नियम भी हैं जिनका उपयोग आप कुछ रूट्स को सुरक्षित रखने के लिए कर सकते हैं।
00:28:54तो यहाँ कई अलग-अलग विकल्प मौजूद हैं।
00:28:56डैशबोर्ड के अंदर आपको बहुत सारी ऑब्जर्वैबिलिटी मिलेगी कि कौन से रूट्स सर्व किए जा रहे हैं।
00:29:04आप हर एक डिप्लॉयमेंट के लिए एक 'डिप्लॉयमेंट समरी' भी देखेंगे जिसमें सभी रूट्स के बारे में
00:29:10जानकारी होगी, ताकि आप प्रत्येक रूट और फंक्शन के बारे में जानकारी का निरीक्षण कर सकें।
00:29:15तो इसे एक बार आज़माएँ, अगर आपके पास कोई सवाल है तो मुझे और विस्तार से जवाब देने में खुशी होगी।
00:29:22अद्भुत।
00:29:34ठीक है, चलिए एक और सवाल देखते हैं जो मैंने सामने आते हुए देखा है, जिसके बारे में
00:29:41शायद आप लोगों ने थोड़ा बताया था, पर शायद थोड़ी और जानकारी मिल सके।
00:29:43क्या प्रोजेक्ट लेवल रूट्स का उपयोग ट्रैफिक को एक्सटर्नल APIs या माइक्रोसर्विसेज पर भेजने के लिए किया जा सकता है?
00:29:51हाँ, बिल्कुल।
00:29:55तो इसके लिए एक टेम्पलेट है, शायद यश क्या आप इसके बारे में बात करना चाहेंगे क्योंकि आप
00:30:04इस पर काम कर रहे हैं? ज़रूर, मैं बता सकता हूँ।
00:30:06हाँ, आप निश्चित रूप से अपने सभी API रिक्वेस्ट को एक्सटर्नल ओरिजिन पर रीराइट कर सकते हैं।
00:30:11मैं आने वाले हफ़्तों में इस पर और जानकारी शेयर करूँगा लेकिन आप राइटिंग नियम सेट कर सकते हैं।
00:30:15मैं वास्तव में अपनी स्क्रीन शेयर कर सकता हूँ और सोच रहा हूँ।
00:30:18लेकिन अगर मैं एक राइटिंग नियम सेट करता हूँ तो मैं उदाहरण के लिए अपने API से एक रीराइट सेट कर सकता हूँ।
00:30:35किसी भी एक्सटर्नल ओरिजिन पर, उदाहरण के लिए अगर वह https/api-external.com जैसा कुछ है
00:30:44तो आप अपने API को एक्सटर्नल ओरिजिन पर प्रॉक्सी करने के लिए ऐसा कुछ कर सकते हैं।
00:30:50लेकिन हाँ, यह पूरी तरह से सपोर्टेड है और आप इसे CLI के माध्यम से
00:31:00या किसी अन्य तरीके से भी कर सकते हैं।
00:31:04बढ़िया, यह काम बहुत आसान बना देता है जब आप आंशिक रूप से स्विच कर रहे हों, मुझे पता है कि हम
00:31:10अपनी कम्युनिटी साइट के साथ इसका थोड़ा उपयोग कर रहे हैं ताकि हम कुछ एक्स्ट्रा फीचर्स बना सकें।
00:31:16तो यह सब 'डिस्कोर्स' (discourse) का हिस्सा नहीं है लेकिन आप जानते हैं, हम पूरी तरह से डिस्कोर्स को छोड़ना
00:31:21भी नहीं चाहते, वही कम्युनिटी साइट की मुख्य नींव है और फिर हमारे पास इसके ऊपर कुछ एक्स्ट्रा चीज़ें हैं
00:31:25तो यह हमारे लिए बहुत सुविधाजनक रहा है।
00:31:27हाँ, यह निश्चित रूप से एक बहुत बड़ी उपलब्धि थी।
00:31:31हाँ, मुझे वाकई लगता है कि यह बहुत उपयोगी है कि आपको कैशिंग लेयर,
00:31:35फ़ायरवॉल और राउटिंग नियमों के लाभ मिलते हैं जहाँ आप इस आसान सिंटैक्स के साथ तय कर सकते हैं
00:31:42कि क्या करना है, लेकिन साथ ही उन अलग बैकएंड्स का भी उपयोग कर सकते हैं जिन पर आपका कंटेंट पहले से मौजूद है।
00:31:48शानदार, और मुझे लगता है कि चैट के सभी सवाल खत्म हो गए हैं, पर मैं पूछना चाहूँगा कि आगे क्या है?
00:31:56क्या आप हमें कुछ बता सकते हैं?
00:32:00ओह, बहुत अच्छा सवाल है।
00:32:02वैसे आगे कई चीज़ें हैं लेकिन मुझे लगता है कि उनमें से एक चीज़ जिसके बारे में हमने
00:32:09पहले बात की थी कि हमें और काम करना चाहिए, वह है सुरक्षा, तो जल्द ही सुरक्षा पर और कंटेंट की उम्मीद करें।
00:32:15हमारे साथ जुड़ने के लिए आप लोगों का शुक्रिया, मुझे पता है कि आप बहुत व्यस्त हैं इसलिए हम आपको
00:32:22अपने काम पर वापस जाने देंगे लेकिन यहाँ आने के लिए समय निकालने के लिए हम आपकी सराहना करते हैं।
00:32:25हमें बुलाने के लिए बहुत-बहुत धन्यवाद।
00:32:28हाँ, आपका बहुत-बहुत धन्यवाद।
00:32:30सबका शुक्रिया।
00:32:30ठीक है, वह बहुत अच्छा था, माया हमारे पास आगे क्या आ रहा है?
00:32:37ओह, हमारे पास गुरुवार को सैंडबॉक्स 'आस्क मी एनीथिंग' (AMA) है।
00:32:45तो उसके लिए बने रहें।
00:32:47इसके अलावा, मैं इसके बारे में भी बताना चाहती हूँ क्योंकि
00:32:54'जीरो टू एजेंट' Vercel इवेंट्स के लिए वीकेंड पर कुछ बहुत ही रोमांचक इवेंट्स हो रहे हैं। जून में हमारा 'शिप' (Ship) इवेंट भी आ रहा है और अगर आपने
00:33:03अभी तक नहीं देखा है, तो [vercel.com/ship](https://vercel.com/ship) पर जाएँ और आप अपना छोटा सूटकेस बना सकते हैं।
00:33:09डिज़ाइन टीम ने इस पेज पर वाकई बहुत कमाल का काम किया है इसलिए इसे ज़रूर देखें और
00:33:15दुनिया भर में होने वाले इन इवेंट्स के लिए तारीख याद रखें और हाँ, हमारे पास और कम्युनिटी सेशन्स आ रहे हैं
00:33:21तो आप उन सभी को [community.vercel.com/events](https://www.google.com/search?q=https://community.vercel.com/events) पर देख सकते हैं।
00:33:26सबका धन्यवाद, यह बहुत अच्छा रहा।
00:33:28बाय!

Key Takeaway

Vercel का नया CDN डैशबोर्ड और एज कॉन्फ़िगरेशन फीचर्स डेवलपर्स को बिना कोड बदले या फिर से डिप्लॉय किए अपनी साइट के ट्रैफ़िक, कैशिंग और सुरक्षा को नियंत्रित करने की अभूतपूर्व शक्ति देते हैं।

Highlights

Vercel CDN अब फ्रेमवर्क कोड को मूल रूप से समझता है, जिससे मैन्युअल कॉन्फ़िगरेशन की आवश्यकता समाप्त हो जाती है।

नया CDN डैशबोर्ड 3D मैप विज़ुअलाइज़ेशन के साथ वैश्विक ट्रैफ़िक का रीयल-टाइम अवलोकन प्रदान करता है।

प्रोजेक्ट लेवल राउटिंग नियमों को अब बिना नया डिप्लॉयमेंट किए सीधे डैशबोर्ड से बदला जा सकता है।

AI-पावर्ड नियम जनरेशन की मदद से प्राकृतिक भाषा का उपयोग करके जटिल रीडायरेक्ट और हेडर सेट किए जा सकते हैं।

कैश पर्जिंग के लिए 'Invalidate' और 'Delete' जैसे विकल्प उपलब्ध हैं, जो बेहतर परफॉरमेंस सुनिश्चित करते हैं।

सभी प्रोजेक्ट्स के लिए अनमीटर्ड DDoS सुरक्षा और वेब एप्लिकेशन फ़ायरवॉल (WAF) डिफ़ॉल्ट रूप से शामिल हैं।

Timeline

परिचय और Vercel CDN की बुनियादी बातें

एमी और माया ने Vercel कम्युनिटी लाइव सेशन की शुरुआत की और CDN टीम के सदस्यों मार्क, एंड्रयू और यश का स्वागत किया। मार्क ने बताया कि Vercel पर हर प्रोजेक्ट स्वचालित रूप से CDN का उपयोग करता है और इसके वैश्विक स्तर पर 125 से अधिक पॉइंट ऑफ़ प्रेजेंस (PoP) हैं। यह सेक्शन समझाता है कि कैसे रिक्वेस्ट क्लाइंट से PoP और फिर क्षेत्रीय कैशिंग लेयर्स तक पहुँचती है। इसमें यह भी बताया गया है कि TLS टर्मिनेशन और रूटिंग कहाँ होती है। यह बुनियादी ढांचा समझना महत्वपूर्ण है क्योंकि यही Vercel की तेज़ डिलीवरी और हाई अवेलेबिलिटी का आधार है।

Vercel CDN की विशेषताएं और लाभ

मार्क ने विस्तार से बताया कि Vercel CDN अन्य पारंपरिक CDN से कैसे अलग है क्योंकि यह फ्रेमवर्क को नेटिव रूप से समझता है। इसमें इंक्रीमेंटल स्टैटिक रीजनरेशन (ISR) जैसे फीचर्स शामिल हैं जो बिना डिप्लॉयमेंट के पेजों को अपडेट करने की अनुमति देते हैं। सुरक्षा के लिहाज़ से, यह हमेशा चालू रहने वाला DDoS प्रोटेक्शन और कॉन्फ़िगर करने योग्य फ़ायरवॉल प्रदान करता है। हालिया अपडेट्स में एक नया डैशबोर्ड अनुभव और 10 लाख तक बल्क रीडायरेक्ट्स की क्षमता जोड़ी गई है। यह खंड डेवलपर्स के लिए कम मेहनत में अधिक परफॉरमेंस पाने के तरीकों पर केंद्रित है।

डैशबोर्ड डेमो और बल्क रीडायरेक्ट्स

एंड्रयू ने लाइव डेमो के माध्यम से नए CDN टैब और उसके विज़ुअलाइज़ेशन फीचर्स का प्रदर्शन किया। उन्होंने दिखाया कि कैसे 3D और 2D मैप्स का उपयोग करके दुनिया भर से आने वाले ट्रैफ़िक को ट्रैक किया जा सकता है। इसके बाद उन्होंने बल्क रीडायरेक्ट्स बनाने की प्रक्रिया दिखाई, जिसमें स्टेजिंग वातावरण में बदलावों का परीक्षण करना शामिल है। उपयोगकर्ता प्रोडक्शन में पब्लिश करने से पहले अपने नए नियमों को वेरीफाई कर सकते हैं। यह टूल विशेष रूप से बड़े माइग्रेशन या मार्केटिंग कैंपेन के दौरान URL प्रबंधन को सरल बनाने के लिए डिज़ाइन किया गया है।

AI-संचालित राउटिंग और कैशिंग नियम

यश ने डैशबोर्ड में AI का उपयोग करके प्राकृतिक भाषा से राउटिंग नियम बनाने का एक प्रभावशाली डेमो दिया। उन्होंने दिखाया कि कैसे केवल निर्देश देकर बीटा कुकी वाले उपयोगकर्ताओं के लिए 'v2' डैशबोर्ड पर रीराइट नियम सेट किया जा सकता है। इसके अलावा, उन्होंने इमेजेस के लिए कैश-कंट्रोल हेडर सेट करने और उसे तुरंत पब्लिश करने का तरीका भी साझा किया। यह सेक्शन यह भी स्पष्ट करता है कि इन नियमों को वर्शन कंट्रोल के लिए कोड (Vercel.json) में कैसे निर्यात किया जा सकता है। यह लचीलापन डेवलपर्स को अपनी ज़रूरत के अनुसार डैशबोर्ड या कोड के बीच चयन करने की अनुमति देता है।

कैश प्रबंधन और पर्जिंग तकनीक

मार्क ने Vercel की बहु-स्तरीय कैशिंग संरचना को एक विस्तृत आरेख के माध्यम से समझाया जिसमें CDN, ISR और डेटा कैश शामिल हैं। उन्होंने कैश पर्जिंग की कार्यक्षमता का प्रदर्शन किया, जहाँ 'Invalidate' विकल्प का उपयोग स्टेल कंटेंट सर्व करने के लिए किया जाता है जबकि नया डेटा बैकग्राउंड में लोड होता है। यह तकनीक उपयोगकर्ता के लिए लेटेंसी को कम करती है और वेबसाइट को हमेशा ताज़ा रखती है। विशिष्ट 'कैश टैग' का उपयोग करके केवल चुनिंदा पेजों को पर्ज करने की क्षमता भी दिखाई गई। यह हिस्सा साइट की ताज़गी और सर्वर लोड के बीच संतुलन बनाने के लिए महत्वपूर्ण है।

प्रश्नोत्तर सत्र: लागत, सुरक्षा और माइग्रेशन

अंतिम भाग में टीम ने दर्शकों के सवालों के जवाब दिए, जिसमें CDN की लागत और अन्य CDN प्रदाताओं से Vercel पर माइग्रेट करने की प्रक्रिया शामिल थी। उन्होंने स्पष्ट किया कि बुनियादी सुरक्षा और CDN फीचर्स हॉबी और प्रो प्लान्स में शामिल हैं। बाहरी APIs पर ट्रैफिक रीराइट करने और सेंसिटिव डेटा को सुरक्षित रखने के लिए 'डिप्लॉयमेंट प्रोटेक्शन' के उपयोग पर भी चर्चा की गई। अंत में, भविष्य के अपडेट्स जैसे 'सुरक्षा पर विशेष सत्र' और आगामी 'Vercel Ship' इवेंट की घोषणा की गई। यह समापन सत्र डेवलपर्स की व्यावहारिक चिंताओं को दूर करता है और आगे के रोडमैप की झलक देता है।

Community Posts

View all posts