خب، سلام و عرض ادب خدمت تمامی دوستان، امیدوارم که حالتون خوب باشه، توی این پست نسبتا کوتاه قصد دارم درمورد مفهوم Polyfill در طراحی‌وب صحبت کنم، مفهومی که چیز پیچیده‌ای نداره و شاید در حد یک جمله بشه این پست رو جمع کرد، ولی برای درک بهتر سعی می‌کنیم مثال‌هایی مرتبط بیاریم و با یک داستان تایم‌لاین ترتیبی پیش بریم
برنامه‌ها چطوری کار می‌کنند ؟
برنامه‌هایی که ما به‌صورت روزانه از اون‌ها استفاده می‌کنم، در مرحله اصلی توسط یک OS ، اجرا و هندل می‌شن، که معمولا کارهای پیچیده و عجیبی که برای ران شدن برنامه‌نیاز هست رو OS های ما هندل می‌کنند، در سطوح پایین‌تر برای اینکه ما بتونیم برنامه‌ای بنویسیم که با یک OS خاص سازگار باشه نیاز داریم که از Development Kit اون OS استفاده کنیم و بتونیم یک پروتکل ارتباطی با سیستم‌عامل‌مون داشته باشیم و بهش بگیم که بیا و این کد‌ها رو اجرا کن
در برنامه‌نویسی برای موبایل یا دسکتاپ یا سایر سخت‌افزارها، ما معمولا از یک‌سری کامپوننت‌ها و فریمورک‌ها و کیت‌های توسعه‌ای استفاده می‌کنیم که کار ما رو آسون‌تر می‌کنند و به‌عبارتی Heavy Lifting های ما رو گردن می‌گیرند
یا به عبارت ساده‌تر، کدهای ما معمولا یک موش کوچک هستند که روی دوش یک فیل بزرگ (Development Kit) سوار می‌شن و به مسیرشون ادامه می‌دن
این ترکیب کدهای ما با ابزار‌های ارائه شده توسط کیت توسعه، باعث میشه که ما به یک فایل باینری واحد برسیم که قابل توزیع باشه، یعنی ما یک‌بار کدمون رو می‌نویسیم و با تمام پیش‌نیاز‌هایی که برای اجرا داره کامپایل می‌کنیم و به یک فایل نهایی می‌رسیم که تمامی پیش‌نیازهای خودش رو برای اجرا به‌همراه خودش داره
به‌عبارت ساده‌تر، ما یک فردی رو آماده سفر می‌کنیم که توی چمدونش همه چیز برای یک سفر ایده‌آل رو داره و به هرچیزی که نیاز داره تا بتونه اجرا بشه رو همراه خودش توی باندل (Bundle) خودش داره و همین باعث میشه که برنامه‌هایی که ما برای پلتفرم خاصی می‌نویسیم معمولا پایدار‌تر باشند و انتظار داریم که بدون خطای خاصی اجرا بشن
وبسایت‌ها چطوری کار می‌کنند ؟
وبسایت‌ها بر خلاف اپلیکیشن‌ها و نرم‌افزارها، محدود به پلتفرم خاصی نیستند، هر پلتفرمی که بتونه مرورگر داشته باشه، می‌تونه وبسایت‌ها رو بالا بیاره و اجرا کنه و نتیجه رو برای ما نشون بده
از گوشی‌های دکمه‌ای قدیمی گرفته تا کامپیوتر‌های مدرن امروزی، همگی می‌تونند صفحات وب رو در حد خودشون اجرا کنند و نتیجه رو به کاربر نشون بدند به‌شرطی که: نرم‌افزاری مخصوص به عنوان مرورگر وب (Web Browser) داشته باشند
این قدرت عرصه وب رو مشخص می‌کنه، که فاقد از پلتفرم هست و هر شخصی با هر دیوایسی معمولا می‌تونه به اینترنت دسترسی پیدا کنه و صفحات وب ما رو ببینه
ما در توسعه وب، معمولا چیزی به اسم Development Kit برای OS خاص نداریم، ما صفحات وب‌مون رو برای OS خاص توسعه نمی‌دیم، ما صفحات وب‌مون رو برای نرم‌افزاری خاص به‌عنوان Web Browser توسعه می‌دیم
مشکل طراحی وب و مرورگرها
یکی از ابتدایی‌ترین مشکلاتی که معمولا در طراحی وب با اون مواجه میشیم، تنوع بسیار زیاد مرورگرها هست، ما به‌عنوان یک توسعه‌دهنده وب مجبور هستیم یک صفحه‌ای طراحی کنیم که: داخل مرورگرهای مختلفی در سیستم‌عامل‌های مختلف به‌شکل صحیح نمایش داده بشه
ما به‌عنوان دولوپر اندروید یا iOS یا ویندوز یا ... این توانایی رو داریم که مشخص کنیم که برنامه ما از یک Min Version به بالا اجرا بشه، ولی در وب معمولا به‌صورت نیتیو چنین امکانی رو نداریم و مجبور هستیم بسیاری از مواردی که باعث ناسازگاری در مرورگرهای مختلف می‌شن رو خودمون به‌صورت دستی یا با استفاده از ابزار‌های جانبی هندل کنیم
مفهوم Polyfill
در فرایند طراحی‌وب، Polyfill ها مجموعه کد‌هایی هستند که یک قابلیتی رو که مرورگر در حالت عادی پشتیبانی نمی‌کنه، با استفاده از کد‌هایی که مرورگر پشتیبانی می‌کنه، پایه‌گذاری می‌کنند تا در نتیجه اون بتونیم از اون قابلیت استفاده کنیم
به‌عبارت ساده‌تر، ما نیاز داریم اتاق‌مون رو تمیز کنیم ولی دسترسی به جارو برقی نداریم، ولی چون به جاروی دستی دسترسی داریم، می‌تونیم به نتیجه نهایی که یک اتاق تمیز هست، برسیم
پس ما هر جا که میریم، جاروی دستی رو با خودمون می‌بریم، ابتدا چک می‌کنیم ببینیم آیا دسترسی به جارو برقی داریم یا نه، اگر داشتیم که از جارو برقی استفاده می‌کنیم، ولی اگر نداشتیم، ناچارا از جاروی دستی استفاده می‌کنیم تا به هدف نهایی‌مون برسیم
در فرایند کدنویسی وب، مرورگرهای جدید قابلیت‌هایی رو به‌صورت Native پشتیبانی می‌کنند در نسخه‌های قدیمی معمولا چنین پشتیبانی‌هایی وجود نداره، ولی از اونجایی که اکثر مرورگرها از کد پایه Javascript پشتیبانی می‌کنند ما می‌تونیم کدهای جدیدمون رو با استفاده از Polyfill ها در مرورگرهای قدیمی هم قابل استفاده کنیم
در واقع برای این امر، ترنسپایلر‌هایی مثل Babel یا ... هم وجود دارند که می‌تونند کدهای ES6 یا جدیدتر ما رو بگیرند و به کدهای Polyfill شده برای نسخه‌های قدیمی‌تر تبدیل کنند تا روی مرورگرها قدیمی‌تر هم اجرا بشن
نتیجه‌گیری
توی این پست با مفهوم Polyfill در وب آشنا شدیم و همچنین به‌صورت خلاصه فهمیدیم که برنامه‌ها چطوری روی OS سوار می‌شن و کار می‌کنند و تفاوت عمده برنامه‌ها با وبسایت‌ها چی هست و یکی از مشکل‌های مرسوم مرورگرها رو متوجه شدیم
امیدوارم که این پست براتون مفید باشه، ممنون از وقتی که صرف خوندن این مطلب کردید، پاینده باشید