<head> میں <link>s رکھنا
<head> میں <link>s رکھنا ایک بہتر ویب سائٹ کی تعمیر میں مناسب تفصیلات کا حصہ ہے۔ جب کوئی صفحہ پہلی بار لوڈ ہوتا ہے، تو HTML اور CSS کو بیک وقت پارس کیا جا رہا ہوتا ہے؛ HTML DOM (Document Object Model) بناتا ہے اور CSS CSSOM (CSS Object Model) بناتا ہے۔ دونوں ایک ویب سائٹ میں بصری بنانے کے لیے ضروری ہیں، جو ایک تیز "پہلی معنی خیز پینٹ" ٹائمنگ کی اجازت دیتا ہے۔ یہ ترقی پسند رینڈرنگ ایک زمرہ کی اصلاح ہے جس میں سائٹوں کی کارکردگی کے سکور میں پیمائش کی جاتی ہے۔ اسٹائل شیٹس کو دستاویز کے نچلے حصے کے قریب رکھنا وہ چیز ہے جو بہت سے براؤزرز میں ترقی پسند رینڈرنگ کو روکتی ہے۔ کچھ براؤزرز رینڈرنگ کو روک دیتے ہیں تاکہ صفحے کے عناصر کو دوبارہ پینٹ کرنے سے بچ سکیں اگر ان کے اسٹائل تبدیل ہوتے ہیں۔ صارف پھر ایک خالی سفید صفحہ دیکھتا رہ جاتا ہے۔ دوسرے اوقات میں اسٹائل نہ کیے گئے مواد (FOUC) کی جھلک ہو سکتی ہے، جو بغیر کسی اسٹائلنگ کے ایک ویب صفحہ دکھاتا ہے۔
<script>s کو </body> سے بالکل پہلے رکھنا
<script> ٹیگز HTML پارسنگ کو روکتے ہیں جب انہیں ڈاؤن لوڈ اور عمل میں لایا جاتا ہے جو آپ کے صفحے کو سست کر سکتا ہے۔ اسکرپٹس کو نیچے رکھنے سے HTML کو پہلے پارس اور صارف کو دکھانے کی اجازت ملے گی۔
<script>s کو نیچے رکھنے کا ایک استثنا یہ ہے جب آپ کے اسکرپٹ میں document.write() شامل ہو، لیکن آج کل document.write() کا استعمال ایک اچھا عمل نہیں ہے۔ نیز، <script>s کو نیچے رکھنے کا مطلب یہ ہے کہ براؤزر اسکرپٹس کو ڈاؤن لوڈ کرنا شروع نہیں کر سکتا جب تک کہ پوری دستاویز پارس نہ ہو جائے۔ یہ یقینی بناتا ہے کہ آپ کا کوڈ جسے DOM عناصر میں ترمیم کرنے کی ضرورت ہے وہ کوئی غلطی نہیں پھینکے گا اور پورے اسکرپٹ کو روک نہیں پائے گا۔ اگر آپ کو <script>s کو <head> میں ڈالنے کی ضرورت ہے، تو defer وصف کا استعمال کریں، جو HTML کے پارس ہونے کے بعد ہی اسکرپٹ کو چلانے کا وہی اثر حاصل کرے گا لیکن براؤزر اسکرپٹ کو پہلے ڈاؤن لوڈ کر سکتا ہے۔
یاد رکھیں کہ اسکرپٹس کو بند ہونے والے </body> ٹیگ سے بالکل پہلے رکھنا یہ تاثر پیدا کرے گا کہ صفحہ خالی کیشے پر تیزی سے لوڈ ہوتا ہے (کیونکہ اسکرپٹس دستاویز کے باقی حصوں کو ڈاؤن لوڈ کرنے میں رکاوٹ نہیں بنیں گے)۔ تاہم، اگر آپ کے پاس کچھ کوڈ ہے جسے آپ صفحہ لوڈ کے دوران چلانا چاہتے ہیں، تو یہ پوری صفحہ لوڈ ہونے کے بعد ہی چلنا شروع ہوگا۔ اگر آپ ان اسکرپٹس کو <head> ٹیگ میں ڈالتے ہیں، تو وہ پہلے چلنا شروع کر دیتے ہیں - تو ایک تیار کیشے پر صفحہ دراصل تیزی سے لوڈ ہوتا ہوا نظر آئے گا۔
<head> اور <body> ٹیگز اب اختیاری ہیں
HTML5 کی تفصیلات کے مطابق، کچھ HTML ٹیگز جیسے <head> اور <body> اختیاری ہیں۔ گوگل کی اسٹائل گائیڈ بھی بائٹس بچانے کے لیے انہیں ہٹانے کی سفارش کرتی ہے۔ تاہم، یہ عمل ابھی تک وسیع پیمانے پر اپنایا نہیں گیا ہے اور کارکردگی کا فائدہ بہت کم ہونے کا امکان ہے اور زیادہ تر سائٹوں کے لیے اس سے کوئی فرق نہیں پڑے گا۔