استفاده تنها از تکنولوژی css در پروژه طراحی سایت بسیار مناسب است. اما زمانی که کدهای شما زیاد می شود پیچیدگی در مدیریت پروژه های بسیار بزرگ را در پی خواهد داشت. به همین منظور برای جلوگیری از ایجاد کدهای تکراری CSS می توان به بهترین روش، با یک Preprocessor کنترل کرد. LESS و SASS هر دو ابزار بسیار کاربردی برای بهینه سازی کدهای زبان css می باشند.

در ادامه قصد داریم این دو ابزار LESS و SASS با هم بررسی کنیم؛ پس تا انتهای مقاله با ما همراه باشید.

Less چیست؟

پلتفرم Less یا Leaner Style Sheets امکان کد نویسی، استایل دهی صفحات وب سایت را بسیار ساده‌تر می‌کند. این تکنولوژی با امکانات یک زبان برنامه نویسی مثل تعریف متغیر، ادغام کردن متغیرها و دیگر مزیت ها، برای نوشتن کدهای CSS استفاده می شود و با کمک Less می توان کدها را با سرعت بالا و خوانا‌ نوشت.

در حقیقت کامپایلر پلتفرم LESS با زبان جاوا اسکریپت نوشته شده است و کدها را به فرمت استاندارد CSS تبدیل می‎کند. نوشتن کدهای Css با دید ماژولار از امکانات این فریم‎ ورک به شمار می آید.

Sass چیست؟

Sass (که مخفف عبارت Syntactically Awesome style sheets) است، یک زبان مکمل CSS است که به شما اجازه می دهد از مواردی مانند متغیرها، قوانین تودرتو و موارد دیگر استفاده کنید. این پلتفرم به سازماندهی کدهای css کمک می کند و به شما امکان می دهد سریعتر استایل شیت ایجاد کنید. Sass با تمام نسخه های CSS سازگار است. تنها شرط لازم برای استفاده از آن این است که باید Ruby را نصب کرده باشید.

پلتفرم Sass امکانات زیادی مانند عملگرها، وراثت، متغیرها (Variables)، دستورات تودرتو (Nesting)، وارد کردن قطعه کدها (Partial Imports) و گروه‌بندی کدها (Mixins) را در استایل دهی Css را فراهم می‌کند.

مزایای استفاده از LESS

•  ایجاد کد های CSS مشابه زبان ‎های برنامه ‎نویسی مثل PHP
• توسعه کدنویسی CSS و استفاده بهینه و کاربردی از CSS3
• امکان پیاده ‎سازی در دو سمت سرور و کاربر
• استفاده از  متغیر ها مشابه زبان PHP و بکارگیری از آنها در سایر قسمت ‎ها
•  اجرای آسان عملیات بر روی متغیر ‎ها
• کدنویسی css با سرعت بالا به کمک mixin
• خوانایی و پیمایش کاملا بهینه شده دستورات تو در تو
• مزایای استفاده از SASS
• سازگاری کامل با CSS
• به کارگیری از متغیرها و کدهای تو در تو و MIXINها
• استفاده از توابع مفید برای ایجاد تغییرات رنگ و مقادیر دیگر
• ویژگی‌های حرفه ای مثل دستورالعمل‌های مدیریت کتابخانه‌ها
• ارائه خروجی قابل تنظیم با فرمت قابل تنظیم

فرق بین SASS و LESS

اولین تفاوت بین LESS با SASS همانطور که اشاره شد پلتفرم LESS به زبان جاوا اسکریپت نوشته شده و ولی پلتفرم SASS به زبان Ruby. این دو پلتفرم تفاوت چندانی با یکدیگر ندارد ولی ممکن است نصب و راه اندازی LESS آسان تر باشد. 

دومین تفاوت بین LESS با SASS این است که پلتفرم LESS از فریم ورک های بسیار کاربردی مانند Compass که در SASS نظر گرفته شده، وجود ندارد. در واقع اکثرا طراحان وب فقط برای استفاده از Compass از SASS استفاده می کنند.

هنگام تعریف کردن متغیرها در SASS و LESS متفاوت می باشد که در پلتفرم Sass در ابتدای نام متغیر علامت $ گذاشته می شود. در صورتی که در LESS از علامت @ برای تعریف متغیر ها استفاده می شود. در نظر داشته باشید که در CSS از علامت @ مثل media@ استفاده می شود.

ایجاد حلقه ها در پلتفرم LESS بر اساس پیمایش داده های عددی انجام می شود؛ در صورتی که در SASS می تواند بر روی تمامی نوع داده ها پیمایش انجام دهد که بسیار کاربردی در پروژه ها می باشد.

در هر دو نوع پیش پردازنده امکان تعریف mixin وجود دارد. البته بعد از تعریف کردن mixin دیگر نمی توانید مقادیر را تغییر دهید. زیرا ممکن است در چندین پروژه از آن استفاده کرده باشید و با تغییر آن مشکلاتی بوجود می آورد.

در پلتفرم SASS با استفاده از فریمورک Compass می توان اطمینان  داشت که mixin های خود را آپدیت نگه می دارد پس دقت داشته باشید که در موقعیت هایی که قرار است از یک mixin استفاده کنید، آن را کنترل کنید.

سخن پایانی

هر دو پردازنده های LESS و SASS در میان توسعه دهندگان وب محبوب هستند. پلتفرم Less مشابه پیش پردازنده sass در کدنویسی Css سازماندهی بسیار زیادی می دهد. این دو پلتفرم دارای امکانات، مزایا مختلفی می باشد که در این مقاله توضیحاتی برای شناخت و آگاهی شما ارائه شده است. بنابراین انتخاب بین Less و Sass به علاقه و نیاز شخصی شما بر می گردد؛ زیرا هر کدام از آن ها نقاط قوت و ضعف خاص خود را به همراه دارد.

اگر در یادگیری هر یک پیش پردازنده های Sass و Less اجباری ندارید، پیشنهاد می شود که از SASS استفاده کنید. همین طور اگر یکی از این دو پلتفرم را یاد بگیرید؛ یاد گرفتن دیگری وقت زیادی از شما نخواهد گرفت. در پایان در صورت وجود هرگونه سوال در این زمینه در قسمت نظرات با ما در میان بگذارید.