आपण नेस्टेड सारण्या वापरणे टाळावे का

नेस्टेड टेबल्स आपले वेब पृष्ठे कमी करा

वेब पृष्ठे जलद डाउनलोड करण्याची आवश्यकता आहे, परंतु नेस्टेड सारण्या प्रक्रिया धीमे करू शकतात. अधिक लोकांना आपण ब्रॉडबँड किंवा हाय स्पीड इंटरनेटचा वापर करावा असे कोणालाही सांगू नका, म्हणून आपल्याला आपल्या पृष्ठांची लोड किती जलद करण्याची चिंता करण्याची गरज नाही. वेबवरील सामग्रीच्या संख्येसह, एक पृष्ठ किंवा साइट जे हळूहळू लोड करते ते कमीत कमी अभ्यागतांपेक्षा द्रुतपणे लोड होते. गती फार महत्वाची आहे.

नेस्टेड टेबल म्हणजे काय?

नेस्टेड टेबल हे HTML सारणी आहे ज्यात त्यात दुसरी टेबल आहे उदाहरणार्थ:

<सारणी>

स्तंभ 1
स्तंभ 2
स्तंभ 3


स्तंभ 1

<सारणी>

नेस्टेड टेबल स्तंभ 1
नेस्टेड टेबल स्तंभ 2



स्तंभ 3


स्तंभ 1
स्तंभ 2
स्तंभ 3

नेस्टेड टेबल्स पेजेस अधिक धीमी करून डाउनलोड करतात

एका वेब पृष्ठावर एक तक्ता पृष्ठाने (कारणाने) अधिक हळुवारपणे डाउनलोड करणार नाही. पण ज्या क्षणी आपण एका टेबलला दुसर्या टेबलमध्ये ठेवता, ते ब्राउझरला रेंडर करण्यासाठी अधिक क्लिष्ट होते, त्यामुळे पृष्ठ अधिक हळूवारपणे लोड होते. आणि आपण एकमेकांच्या आत आत घालवलेल्या जास्तीत जास्त टेबल्स पृष्ठ धीमे होतील.

जेव्हा आपण सारण्यांसह एखादे पृष्ठ तयार करता, तेव्हा लक्षात ठेवा टेबलमध्ये असलेल्या अधिक सारणी, पृष्ठ धीमे होइल. सर्वसाधारणपणे जेव्हा एखादे पृष्ठ लोड होते, तेव्हा ब्राउझर एचटीएमएलच्या शीर्षावर सुरू होते आणि पृष्ठावर क्रमाने तो खाली लोड करतो. तथापि, नेस्टेड सारण्यांसह, त्यास संपूर्ण गोष्ट प्रदर्शित करण्यापूर्वी टेबलच्या समाप्तीची आवश्यकता आहे.

मांडणीसाठी सारण्या

आपण आपल्या वेब पृष्ठांवर लेआउटसाठी टेबल वापरु नये. त्यांना नेहमी नेस्टेड सारण्या वापरण्याची आवश्यकता असते, म्हणून टेबल-लेआउट वेब पृष्ठ CSS मध्ये डिझाईन केलेल्या समान डिझाइनपेक्षा अधिक हळु लोड करेल.

तसेच, जर आपण वैध एक्सएचटीएमएल लिहिण्याचा प्रयत्न करत असाल तर टेबलचा लेआउटसाठी वापर करू नये. सारण्या टॅबुलर डेटासाठी (जसे की स्प्रेडशीट्स) आहेत, लेआउटसाठी नाही. त्याऐवजी, आपण लेआउट साठी सीएसएस वापरावे - सीएसएस डिझाइन अधिक द्रुतपणे रेंडर करा आणि वैध XHTML ठेवण्यासाठी आपल्याला मदत करेल

जलद लोडिंग टेबल डिझाईन करणे

आपण एकाधिक पंक्तिंसह सारणी डिझाइन केली असल्यास, आपण प्रत्येक पंक्ती वेगळ्या सारणी म्हणून लिहिल्यास ते अधिक त्वरीत लोड करू शकतात. उदाहरणार्थ, आपण असे सारख्या टेबल लिहू शकता:

<सारणी शैली = "रूंदी: 100%;">

शीर्ष पंक्ती


डावीकडे स्तंभ
उजव्या स्तंभातील

परंतु जर आपण सारखी टेबल दोन सारण्या लिहिली असेल तर ते अधिक त्वरेने लोड होईल, कारण ब्राउझर प्रथम एकदा रेंडर करेल आणि नंतर संपूर्ण टेबल एकाच वेळी प्रस्तुती करण्याऐवजी दुसऱ्या प्रस्तुत करेल. ही युक्ती प्रत्येक टेबलमध्ये समान रुंदी आणि इतर शैली (जसे पॅडिंग, मार्जिन आणि सीमा) असल्याची खात्री करणे आहे.

<सारणी शैली = "रूंदी: 100%;">

शीर्ष पंक्ती


<सारणी शैली = "रूंदी: 100%;">

डावीकडे स्तंभ
उजव्या स्तंभातील

एका टेबलमध्ये नेस्टेड टेबल्स रूपांतरित करणे

आपल्याला असे वाटेल की ही सर्व चांगली गोष्ट आहे, पण आपल्याकडे एक टेबल आहे ज्यामध्ये त्यामध्ये दुसरी टेबल असावी. जरी हे खरे असले, तरी आपण नेस्टेड टेबल्स् थोडी अधिक जटिल सिंगल टेबल्समध्ये बदलू शकता आणि आपल्या टेबल सेलवर अॅट्रिब्यूट्स वापरून करु शकता. उदाहरणार्थ, शीर्षस्थानी असलेल्या नेस्टेड टेबलमध्ये, मी हे केवळ एका टेबलमध्ये रूपांतर करू शकतो फक्त colspan गुणधर्म:

<सारणी>

स्तंभ 1
colspan = "2" > स्तंभ 2
स्तंभ 3


स्तंभ 1
नेस्टेड टेबल स्तंभ 1
नेस्टेड टेबल स्तंभ 2
स्तंभ 3


स्तंभ 1
colspan = "2" > स्तंभ 2
स्तंभ 3

हे टेबल नेस्टेड टेबलपेक्षा कमी वर्णांचा वापर करण्याच्या सुविधेसह देखील आहे, जेणेकरुन ते त्यामुळे देखील जलद डाउनलोड करेल.