𝗧𝗮𝗶𝗹𝘄𝗶𝗻𝗱 𝗖𝗦𝗦 𝘃𝟰 बद्दल प्रत्येकजण का भांडत आहे याचे खरे कारण

Tailwind CSS v4 वरील वाद सर्वत्र पाहायला मिळत आहे. बहुतेक लोक चुकीच्या गोष्टीवरून वाद घालत आहेत.

खरा प्रश्न utility classes विरुद्ध inline styles असा नाही. खरा प्रश्न असा आहे की तुमचे styling कुठे साठवले जाते आणि त्याचा मानसिक ताण (mental cost) कोणाला सोसावा लागतो.

Tailwind v4 कॉन्फिगरेशन तुमच्या CSS फाईलमध्ये हलवते. तुम्ही JavaScript config फाईलऐवजी @theme वापरता. यामुळे वर्कफ्लो अधिक सुटसुटीत होतो.

पण वादाचे हे कारण नाही. वाद या गोष्टीवरून निर्माण होतोय की v4 मुळे दोन वेगवेगळ्या पद्धती (patterns) वापरणे अधिक सोपे झाले आहे.

पॅटर्न १: तुमच्या components मध्ये utility classes वापरणे. तुम्ही थेट तुमच्या HTML किंवा JSX मध्ये classes लिहिता. यामुळे एखादा element नेमका कसा दिसतो हे तुम्हाला समजते.

पॅटर्न २: @apply पद्धत. तुम्ही CSS फाईलमध्ये .alert किंवा .alert--error सारखे semantic classes तयार करता. यामुळे एखादा element नक्की काय आहे हे समजते.

दोन्ही पद्धती काम करतात. दोन्हीपैकी कोणतीही चुकीची नाही. त्या वेगवेगळ्या तत्त्वज्ञानावर (philosophies) आधारित आहेत.

Group A 'co-location' मध्ये विश्वास ठेवतो. सर्व काही एकाच ठिकाणी राहते. Group B 'semantic names' मध्ये विश्वास ठेवतो. त्यांना असे नाव हवे असते जे त्या घटकाचा उद्देश स्पष्ट करते.

जेव्हा एखादा डिझायनर error चा रंग लाल वरून नारंगी करतो, तेव्हा Group A ला कोड फाईल्समध्ये शोध घ्यावा लागतो. Group B फक्त CSS फाईलमधील एक ओळ बदलतो.

Tailwind v4 मुळे @apply वापरणे अधिक नैसर्गिक वाटते. यामुळे तणाव अधिक वाढला आहे.

तुमच्या टीमच्या आकारानुसार निवड कशी करावी, ते खालीलप्रमाणे आहे:

  • लहान टीम्स (Small teams): utility classes वापरा. तुम्हाला classes ला नावे देण्यासाठी वेळ खर्च करण्याची गरज नाही. जेव्हा प्रत्येकजण एकाच फाईल्सवर काम करतो, तेव्हा काम वेगाने होते.

  • Component libraries: @apply किंवा CSS variables वापरा. तुमच्या वापरकर्त्यांना (users) तुमचे अंतर्गत design tokens माहित असण्याची गरज नाही.

  • मोठ्या कंपन्या (Large companies): हायब्रिड मॉडेल वापरा. semantic classes ची जबाबदारी design system टीमकडे सोपवा. ॲप्लिकेशन डेव्हलपर्सना जलद लेआउटसाठी utilities वापरू द्या.

केवळ लांब class strings वाचणे टाळण्यासाठी @apply वापरू नका. ती कोणतीही रणनीती (strategy) नाही. ती केवळ टाळाटाळ आहे.

सर्वात जास्त टीका करणारे लोक अनेकदा फ्रेमवर्कपेक्षा त्यांच्या साधनांशी (tools) लढत असतात. जर तुमच्या एडिटरमध्ये IntelliSense नसेल किंवा तुमच्या टीमकडे design token सिस्टम नसेल, तर वर्कफ्लो तुटल्यासारखा वाटेल.

फ्रेमवर्कला दोष देण्यापूर्वी तुमचा वर्कफ्लो सुधारा.

Tailwind v4 हे एक शक्तिशाली रिलीज आहे. CSS-first config अधिक चांगले आहे. हा वाद केवळ एक संकेत आहे की टीम्सना स्पष्ट निर्णय घेण्याची गरज आहे.

एक निवड करा. त्याचे दस्तऐवजीकरण (document) करा. आणि पुढे चला.

तुमच्या टीमचा दृष्टिकोन काय आहे? तुम्ही utility classes वापरता की @apply?

स्त्रोत: https://dev.to/enjoy_kumawat/the-real-reason-everyones-fighting-about-tailwind-css-v4-4o0g