पहले रेंडर को कम से कम समय देने के लिए, हमें तीन वैरिएबल को कम से कम करना होगा:
- महत्वपूर्ण संसाधनों की संख्या.
- महत्वपूर्ण संख्यात्मक विश्लेषण.
- ज़रूरी बाइट की संख्या.
महत्वपूर्ण संसाधन एक ऐसा संसाधन है जो पेज की शुरुआती रेंडरिंग को ब्लॉक कर सकता है. ये संसाधन जितने कम होंगे, ब्राउज़र, सीपीयू, और अन्य रिसॉर्स के लिए उतना ही कम काम होगा.
इसी तरह, क्रिटिकल पाथ लेंथ, ज़रूरी रिसॉर्स और उनकी बाइटाइज़ के बीच डिपेंडेंसी ग्राफ़ का एक फ़ंक्शन है: कुछ रिसॉर्स डाउनलोड, पिछले रिसॉर्स के प्रोसेस होने के बाद ही शुरू किए जा सकते हैं. साथ ही, रिसॉर्स जितना बड़ा होगा उतने ही राउंडट्रिप वह डाउनलोड करेगा.
आखिर में, ब्राउज़र को जितने कम ज़रूरी बाइट डाउनलोड करने पड़ेंगे, उतनी ही तेज़ी से वह कॉन्टेंट को प्रोसेस कर सकेगा और उसे स्क्रीन पर दिखने के लिए रेंडर कर पाएगा. बाइट की संख्या कम करने के लिए, हम संसाधनों की संख्या कम कर सकते हैं (उन्हें हटा सकते हैं या ज़रूरी नहीं बना सकते). साथ ही, हम हर रिसॉर्स को कंप्रेस और ऑप्टिमाइज़ करके, ट्रांसफ़र के साइज़ को कम से कम करना चाहते हैं.
ज़रूरी रेंडरिंग पाथ को ऑप्टिमाइज़ करने के चरणों का सामान्य क्रम यह है:
- अपने ज़रूरी पाथ का विश्लेषण करें और उसकी विशेषता बताएं: संसाधनों की संख्या, बाइट, और लंबाई.
- ज़रूरी संसाधनों की संख्या कम से कम करें: उन्हें खत्म करें, डाउनलोड करने के लिए टाल दें, उन्हें एसिंक के तौर पर मार्क करें, और ऐसे ही दूसरे काम करें.
- डाउनलोड के समय (राउंडट्रिप की संख्या) को कम करने के लिए, ज़रूरी बाइट की संख्या ऑप्टिमाइज़ करना.
- वह क्रम ऑप्टिमाइज़ करें जिसमें ज़रूरी संसाधन लोड होते हैं: अहम पाथ की अवधि कम करने के लिए, सभी ज़रूरी एसेट जल्द से जल्द डाउनलोड करें.