पाठ 30 / 30
PWA Interview Questions
Service worker lifecycle, caching strategies, offline-first design और update handling पर PWA interviews की तैयारी करें।
Core PWA Concepts
Common interview topics: PWA को क्या define करता है? Service worker lifecycle? Caching strategies? Offline-first और network-first के बीच difference? Service worker updates को कैसे handle करते हैं? App shell model क्या है?
Sample Q&A
Common PWA questions के लिए interview answer examples।
**Q: What's the difference between network-first and cache-first?**
A: Network-first fetches from the network first, falling back to cache if offline—ideal for pages that change often. Cache-first serves from cache immediately, checking the network for updates—ideal for static assets.
**Q: How do you handle service worker updates?**
A: Listen to the 'controllerchange' event and the 'message' event in the service worker. Use skipWaiting() to activate immediately or notify users to refresh.
**Q: What's the app shell model?**
A: The app shell is the minimal static shell (HTML, CSS, JS) cached aggressively. Dynamic content loads separately. This pattern enables instant loads and offline-first architecture.Output:
Common interview questions and comprehensive answers prepared.
Interview Tips
Demo PWA build करके, caching strategies में trade-offs को explain करके, real-world PWA implementations (Twitter Lite, Spotify) को discuss करके और browser compatibility को समझकर prepare करें।
त्वरित जाँच
त्वरित जाँच: PWA में service worker का मुख्य उद्देश्य क्या है?
- User interface को render करना
- User authentication tokens को store करना
- TypeScript को JavaScript में compile करना
- Network requests को intercept करना, offline functionality को enable करना और caching को handle करना
Answer
Network requests को intercept करना, offline functionality को enable करना और caching को handle करना — Service workers background scripts हैं जो requests को intercept करते हैं, caches को manage करते हैं और offline support को enable करते हैं।
अंतिम क्विज़ 1/8
अंतिम क्विज़
त्वरित जाँच: कौन-सी file browsers को PWA install और display करना बताती है?
- package.json
- robots.txt
- manifest.json
- sitemap.xml
Answer
manifest.json — Web app manifest में name, icons, start_url और display mode होता है।
अंतिम क्विज़ 2/8
अंतिम क्विज़
त्वरित जाँच: Service worker (localhost के अलावा) कहाँ से परोसा जाना चाहिए?
- Any HTTP page
- A file URL
- A USB drive
- HTTPS
Answer
HTTPS — Service workers को secure context चाहिए।
अंतिम क्विज़ 3/8
अंतिम क्विज़
त्वरित जाँच: Versioned static assets के लिए कौन-सी strategy उपयुक्त है?
- Cache-first
- Network-only
- No caching
- Random
Answer
Cache-first — Fingerprinted assets कम बदलते हैं, इसलिए cache से परोसना सबसे तेज़ है।
अंतिम क्विज़ 4/8
अंतिम क्विज़
त्वरित जाँच: install में event.waitUntil() क्या करता है?
- Skips the event
- Keeps the event alive until a promise settles
- Stops the worker
- Clears the cache
Answer
Keeps the event alive until a promise settles — यह सुनिश्चित करता है कि event खत्म होने से पहले caching पूरी हो।
अंतिम क्विज़ 5/8
अंतिम क्विज़
त्वरित जाँच: बड़े structured offline data को कौन-सा API रखता है?
- localStorage only
- Cookies
- IndexedDB
- window.name
Answer
IndexedDB — IndexedDB structured और बड़े datasets को asynchronously संभालता है।
अंतिम क्विज़ 6/8
अंतिम क्विज़
त्वरित जाँच: Push permission कब माँगनी चाहिए?
- Immediately on page load
- Never
- On every click
- After the user shows interest, in context
Answer
After the user shows interest, in context — संदर्भ के अनुसार prompts की स्वीकृति कहीं ज्यादा होती है।
अंतिम क्विज़ 7/8
अंतिम क्विज़
त्वरित जाँच: नया service worker जल्दी मिलने में कौन-सी header setting मदद करती है?
- Cache-Control: no-cache on sw.js
- Cache-Control: max-age=31536000 on sw.js
- Expires: never
- Set-Cookie
Answer
Cache-Control: no-cache on sw.js — Cached sw.js updates में देरी कर सकता है।
अंतिम क्विज़ 8/8
अंतिम क्विज़
त्वरित जाँच: PWAs के लिए feature detection क्या है?
- Detecting viruses
- Checking an API exists before using it
- Compressing images
- Installing plugins
Answer
Checking an API exists before using it — जैसे 'serviceWorker' in navigator पुराने browsers को चलने देता है।