10 مورد از کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

گردآوری و تالیف : ارسطو عباسی
تاریخ انتشار : 09 خرداد 1397
دسته بندی ها : css

اگر یک جستجوی ساده در گوگل داشته باشید می‌توانید با ابزارهای مختلفی که می‌توانند کارایی وبسایت‌تان را بهبود دهند آشنایی پیدا کنید. موارد مختلفی وجود دارد، از بهینه‌سازی تصاویر گرفته تا پیاده‌سازی یک شبکه توزیع محتوا و موارد دیگر.

اما یکی از چیزهایی که طراحان و توسعه‌دهندگان Front-End کمتر به آن فکر می‌کنند بهینه‌سازی کدهای‌شان است.

این موضوع می‌تواند مربوط به کم کردن درخواست‌های HTTP، کوچک کردن فایل‌ها و یا شخصی‌سازی یک فریمورک برای بهینه‌سازی سرعت آن باشد. نسخه جدید بوت‌استرپ یکی از بهترین فریمورک‌های طراحی وبسایت است اما با این وجود فریمورک نسبتا سنگینی به حساب می‌آید.

من یک لیست را برای کوچک‌ترین و سریع‌ترین فریمورک های موجود که می‌توانند جایگزینی مناسب برای بوت‌استرپ باشند را آماده کرده‌ام. مطمئنا از اینکه ببینید این موارد چقدر عالی هستند و چقدر می‌توانند برگه‌های وبسایت تان را از نظر حجم بهینه کنند شگفت زده خواهید شد.

1. Topcoat

۱۰ مورد از کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

با استفاده از Topcoat شما یک فریمورک با سرعت بارگذاری بسیار بالا را در اختیار خواهید داشت. توسعه‌دهندگان این فریمورک هنگام ساخت آن تست‌های مختلفی را در مقابل با فریمورک‌های مختلف روی Topcoat اجرا کردند. 

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

فریمورک به صورت کامل واکنشگرا است و از استفاده کردن از استایل‌های استفاده شده در این فریمورک نیز ساده است.

2. Milligram

۱۰ مورد از کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

یکی دیگر از فریمورک‌های فرانت اند مینیمال milligram نام دارد که در حال حاضر نسخه ۱.۳ آن منتشر شده است. برای یک رابط کاربری مینیمال این فریمورک بسیار مناسب است و همچنین لازم به ذکر است که بگوییم دنبال کننده‌های بسیاری دارد.

می‌توانید این فریمورک را از طریق پکیج منیجرهای مختلفی مانند Yarn، Bower، npm نصب کنید. در این فریمورک از Normalize استفاده شده است و همراه با آن نیز نسخه‌ی فشرده سازی شده نیز قرار دارد.

در این فریمورک کامپوننت‌ها و ویژگی‌های داینامیکی که در بوت استرپ پیدا می‌شوند را نمی‌توانید پیدا کنید. بنابراین برای توسعه‌دهندگانی که قصد ندارند تا ویژگی‌های حرفه‌ای را در اختیار داشته باشند و نیاز دارند سریع‌تر وبسایت را طراحی کنند بسیار انتخاب مناسبی است.

3. Pure CSS

۱۰ مورد از کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

بهترین چیزی که در رابطه با این فریمورک می‌توان گفت این است که چگونه این فریمورک به سبک ماژولاری استفاده می‌شود. شما می‌توانید فایل استایل‌شیت مربوط به این فریمورک را به صورتی که خودتان دوست دارید شخصی‌سازی کنید و موارد مختلف مانند دکمه‌ها، منو‌ها، فرم و… را در آن قرار داده یا حذف کنید.

یا اگر تنها قصد بهره‌گیری از حالت گرید را دارید می‌تواند آن را به صورت جداگانه دانلود کنید، در این حالت حجم بسته تنها به ۸ دهم کیلوبایت می‌رسد.

این مورد بسیار سبک‌تر از بوت‌استرپ و یا فریمورکی مانند فاوندیشن است.

4. Mincss

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

اولین بار که این کتابخانه را مشاهده کردم در گیت‌هاب در حال جستجو بودم. قبلا از آن استفاده نکردم، اما وقتی کد‌های آن را مشاهده نمودم با خودم گفتم که، این چقدر عالی است.

Min.css به عنوان یک جایگزین بسیار سبک برای بوت استرپ معرفی شده است. در حقیقت این پروژه خود را سبک‌ترین فریمورک موجود معرفی کرده‌ است، به نحوی که حجم آن ۹۹۰ بایت است.

این فریمورک به خوبی در مرورگرهای مختلف حتی مرورگرهای قدیمی پشتیبانی می‌شود.

اگر واقعا دنبال یک کتابخانه سریع و سبک هستید Min.css می‌تواند بهترین مورد باشد. مطمئنا که از آن ناامید نمی‌شوید.

5. Petal

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

Petal یک فریمورک بسیار کوچک است که طراحی منحصر به فردی دارد. در این کتابخانه تعداد قابل توجهی کامپوننت مفید قرار گرفته است. البته در این کتابخانه بیشتر از Less استفاده شده است.

این کتابخانه هنوز در دست توسعه است و نسخه پایدار کنونی ۰.۸.۳ است. تیم توسعه این فریمورک نشان داده‌اند که واقعا یکی از بهترین موارد در بین فریمورک‌های رابط کاربری است و به این زودی‌ها کنار انداخته نمی‌شود.

تمام کامپوننت‌ها اختیاری هستند بنابراین می‌توانید اگر مواردی را دوست ندارید از پروژه‌تان حذف نمایید.

به قسمت مستندات Petal مراجعه کنید تا بتوانید به صورت کامل تمام کامپوننت‌ها و موارد لازم را مشاهده کنید.

6. Picnic

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

با استفاده از Picnic CSS می‌توانید درست چیزی که براساس آن تبلیغ می‌کنند را دریافت کنید: یک کتابخانه سبک و زیبا.

رنگ‌های استفاده شده شبیه به نسخه ساده‌ای از بوت استرپ هستند که از طراحی فلت استفاده می‌کنند. شما می‌توانید از این فریمورک برای تقریبا هر نوع وبسایتی استفاده کنید.

اگر به صفحه نمونه‌ها مراجعه کنید می‌توانید لیست کاملی از المان‌های پیشفرض آن را مشاهده نمایید. 

همچنین در کنار پروژه صفحه مستندات بسیار عالی و ساده‌ای در نظر گرفته شده که می‌توانید از آن برای فراگیری Picnic استفاده کنید. 

7. Kube

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

من واقعا با Kube شگفت زده شدم، این مورد جزو کوچکترین فریمورک‌ها نیز اما یکی از بهترین موارد است. 

البته نباید از حق گذشت چرا که این کتابخانه نیز تا حد نیاز کوچک است.  کتابخانه به صورت کامل همراه با کامپوننت‌های جاوااسکریپتی چیزی حدود به ۳۰ کیلوبایت است. با این حال این مورد چیزی حدود ۱۰ برابر کوچکتر از بوت استرپ است.

اما در میزان کوچکی این مورد هیچ گاه نمی‌تواند با فریمورکی مانند Mincss رقابت کند. برای اینکه بهتر با آن و نمونه کدها آشنا شوید می‌توانید نگاهی مستندات آن بیاندازید. 

8. Chota

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

اگر دنبال چیزی هستید که ۱۰ برابر کوچکتر از Kube باشد، پس باید فریمورک CSS Chota را انتخاب کنید.

حجم این کتابخانه تقریبا ۳ کیلوبایت است و تنها حاوی فایل CSS‌ است. پس نباید انتظار تب‌ها، منوهای دراپ‌داون و موارد پویا باشید.

یکی از ویژگی‌هایی که این فریمورک در مقایسه با دیگر موارد دارد این است که مستقل از هرگونه پیش‌پردازنده دیگری اجرا می‌شود.

خبری از Less و Sass نیست. تنها کافی‌ست آن را به کدهای‌تان اضافه کنید و استفاده نمایید.

9. Furtive

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

Furtive یکی دیگر از فریمورک‌های بسیار سبک CSS چیزی در حد ۲.۴ کیلوبایت است. همچنین این فریمورک به صورت کامل با موبایل سازگاری دارد. این مورد از تکنولوژی‌های مدرن دنیای اینترنت استفاده می‌کند. چیزهایی مانند FlexBox و SVG در آن پیاده‌سازی شده اند.

10. Siimple

کوچک‌ ترین و سریع‌ ترین فریمورک‌ های Front-End

Siimple از طراحی فلت پشتیبانی می‌کند و ساختار کد بسیار ساده‌ای دارد.

این فریمورک طراحی مینیمال را به نقطه جدیدی برده و ساختار بسیار واضح و ساده‌ای در طراحی و توسعه را ارائه می‌کند. رنگ‌ها، تایپوگرافی، گرید و تمام موارد دیگر به صورت منحصر به فرد طراحی شده اند. 

بهتر است که به مستندات این کتابخانه نگاهی بیاندازید. می‌توانید همه چیزهایی که گفته شد را به صورت عملی مشاهده کنید.

در حقیقت باید گفت که تمام موارد این فریمورک بسیار به خوبی ایجاد شده است. مطمئنا با استفاده کردن از هر یک این موارد ناامید نمی‌شوید.

منبع

مقالات پیشنهادی

۱۵ مورد از بهترین فریمورک‌های پایتون برای توسعه‌دهندگان وب

پایتون یکی از قویترین زبان‌های برنامه‌نویسی در جهان به شمار می‌آید و به سرعت نیز رشد کرد، این زبان سطح بالا، تعداد بسیار زیادی کتابخانه دارد که باعث ش...

بهترین پکیج های لاراولی – سری اول

پکیج ها قابلیت عملیاتی لاراول را افزایش می‌دهند و عملکرد آنرا بهبود می‌بخشند. پکیج ها میتوانند یک راه مناسب برای کار با تاریخ در پروژه باشد مثل پکیج C...

۱۰ مورد از بهترین فریمورک‌های رابط کاربری Reactjs

مشغول جستجو برای پیدا کردن یک سری فریمورک رابط کاربری مبتنی بر ری‌اکت بودم، فریمورک‌هایی که بتوانند ترکیب پذیر باشند و مستقیما بتوانند با پروژه‌های ری...

۱۰ مورد از بهترین سازنده‌های وبسایت‌های استاتیک

بیشتر وبسایت‌هایی که امروزه می‌توانید در سطح اینترنت مشاهده کنید به صورت پویا ایجاد شده‌اند. در این حالت بجای اینکه تمام اطلاعات در سند HTML قرار بگیر...