همانطور که وب‌سایت شما رشد می‌کند تا محتوای دلخواه و تعاملی بیشتری را شامل شود، حجم فایل های HTML نیز به طور تصاعدی افزایش می‌یابد. نتیجه آن، ایجاد مشکلات احتمالی برای سرور و کاربران نهایی وب‌سایت است. فشرده سازی یک فایل HTML، در این بخش کاربرد زیاد خواهد داشت.
این مقاله شما را با آنچه که باید در مورد فشرده سازی یک فایل HTML بدانید، آشنا می‌کند. تفاوت بین فشرده‌سازی (compression) و کوچک‌سازی (minification)، نحوه شروع فشرده سازی فایل‌های HTML و سایر راهکارها، جز مواردی هستند که خواهید آموخت.
سرفصل‌های این مقاله عبارتند از:
- تفاوت بین فشرده سازی HTML و minification چیست؟
- چرا یک فایل HTML باید فشرده شود؟
- نحوه فشرده سازی یک فایل HTML
- روش‌های فشرده سازی یک فایل HTML
- مواردی که هنگام فشرده سازی HTML باید از آنها اجتناب کرد.
- فایل HTML را کم حجم و ساده نگه دارید.
تفاوت بین فشرده سازی HTML و minification چیست؟
تصویر(1)
هنگام بررسی روش‌های کاهش حجم و فشرده سازی یک فایل HTML، احتمالاً دو عبارت را می‌شنوید:
- فشرده‌سازی یا Compression
- کوچک‌سازی یا minification
در حالی که مقداری همپوشانی بین این دو موضوع وجود دارد و هر دو می‌توانند برای کاهش حجم یک فایل HTML استفاده شوند اما جایگزین یکدیگر نیستند. دلیل این امر، به کار گیری روش‌های متفاوت برای رسیدن به هدف است.
Minification خطوط و کاراکترهای غیر ضروری را در کد HTML منبع حذف می‌کند. در نتیجه، حجم کل فایل را کاهش داده و بر عملکرد کد تأثیر نمی‌گذارد. در حالی که نسل اول ابزارهای Minification کاربران را مجبور به حذف دستی کد های اضافی می‌کردند اما روش‌های جدید، این فرآیند را خودکار و ساده کرده‌اند.
Compression یا فشرده سازی یک فایل HTML، با Minification متفاوت است. در این روش، جایگزینی کدهای اضافی با اطلاعات مورد نیاز، حجم فایل را کاهش می دهد. فشرده سازی، داده‌های تکراری را حذف می‌کند که lossless compression یا "فشرده سازی بدون تلفات" نامیده می‌شود. بنابراین، هنگامی که HTML را به جای کوچک‌سازی، فشرده می‌کنید، هیچ‌گونه داده‌ای از دست نمی‌رود، با این حال فایل کم‌حجم‌تری دریافت می‌نمایید.
تصویر(2)
فشرده سازی بدون تلفات، کلمات، عبارات یا کاراکترهای تکراری را شناسایی نموده و آنها را حذف می‌کند. همچنین با شماره گذاری، آنها را به اولین نمونه در فایل، متصل می‌نماید. این قابلیت به ابزارهای رفع فشرده‌سازی اجازه می‌دهد تا شکل اصلی فایل را بازسازی کنند.
یک تمایز مهم بین این دو وجود دارد. در حالی که حجم فایل‌های خروجی فشرده‌سازی و کوچک‌سازی مشابه است اما معمولاً فایل‌های فشرده‌شده، پس از اعمال تغییرات، قابل استفاده نیستند. در نتیجه، قبل از اینکه بتوانند عملکردهای ضروری را ارائه دهند، باید از حالت فشرده خارج شوند.
چرا باید یک فایل HTML را فشرده کرد؟
ممکن است تعجب کنید که چرا فشرده سازی یک فایل HTML به عنوان یک راه‌حل موثر در نظر گرفته می‌شود. دو مزیت اصلی برای این مورد وجود دارد. فشرده سازی فایل‌های HTML می‌تواند سرعت وب‌سایت شما را بهبود بخشیده و میزان مصرف پهنای باند را کاهش دهد. در ادامه دلیل اهمیت این دو مورد بیشتر توضیح داده شده است.
بهبود سرعت وب‌سایت
وب‌سایتی را در نظر بگیرید که از مقادیر قابل توجهی کد HTML استفاده می‌کند. هر زمان که یک بازدیدکننده جدید به سایت شما وارد شود، مرورگر آن یک درخواست HTTPS برای صفحات موردنظر ارسال می‌کند که پس از یافتن آن، برای مرورگر ارسال می‌شود.
کد HTML بیشتر، به معنای صفحات بزرگتر است و کاربران نهایی برای دریافت کامل صفحه، به زمان بیشتری نیاز دارند. همه می دانند که زمان بالای لود صفحه موجب ناامیدی بازدیدکنندگان می شود. اگر از ابزارهای فشرده‌سازی HTML سازگار با پروتکل HTTP استفاده می‌کنید، وب سرور شما می‌تواند صفحه را قبل از ارسال توسط سرور، فشرده کند.
در نهایت، مرورگر کاربر پس از دریافت صفحه، آن را از حالت فشرده خارج نموده و سرعت کلی را افزایش می‌دهد. البته این روند نیاز به قدرت CPU بیشتر در سمت سرور دارد و معمولاً پلن‌های میزبانی مدرن می‌توانند با استفاده از منابع اضافی، خود را با آن تطبیق دهند.
پهنای باند
در مورد پهنای باند، فشرده سازی یک فایل HTML می‌تواند حجم ترافیکی که از وب سرور شما به کاربران نهایی منتقل می‌شود را تا 90 درصد کاهش دهد. هزینه برخی از میزبانی‌های وب، با توجه به ترافیک شبکه تعیین می‌شود. این قبیل شرکت‌ها، پلن‌هایی با محدودیت در انتقال داده و جریمه‌هایی برای استفاده بیش از حد، ارائه می‌دهند. هر چه فایل‌های HTML شما کوچکتر باشند، داده‌های کمتری ارسال خواهید کرد و هزینه ماهانه شما کاهش پیدا می‌کند.
نحوه فشرده سازی یک فایل HTML
تصویر(3)
همانطور که در بالا ذکر شد، شکل معمول فشرده سازی یک فایل HTML، "بدون تلفاوت" یا "lossless" است. به این معنی که هیچ داده‌ای در طول فرآیند فشرده‌سازی از بین نمی‌رود اما جهت کاهش حجم، ویرایش می‌شود. در ادامه نحوه عملکرد آن ذکر شده است.
این خط از متن را در نظر بگیرید: "hello hello hello hello"
الگوریتم‌های فشرده‌سازی می‌توانند تکرار صورت گرفته در مثال بالا را تشخیص دهند و اولین کلمه "hello" را به عنوان مرجع شناسایی نمایند. سپس این مرجع را به حال خود رها نموده و از حرف اول دومین "hello"، به عنوان یک ارجاع استفاده کنند:
"hello h{ello h}{ello h}ello"
الگوریتم تشخیص می‌دهد که متن مرجع شش کاراکتر قبل‌تر قرار دارد و همچنین طول آن نیز شش کاراکتر است:
"hello h[6,6]{ello h}ello"
علاوه بر این، تکرار دوم شش کاراکتر دیگر و اینکه چگونه چهار کاراکتر آخر با چهار کاراکتر مرجع اول مشابه هستند را مشخص می‌کند تا خروجی نهایی بسیار کوچکتر شود:
"hello h[6,16]"
ابزارهای فشرده سازی یک فایل HTML
جهت فشرده سازی یک فایل HTML، دو انتخاب وجود دارد: می‌توانید از یک اپلیکیشن رایگان یا پریمیوم استفاده کنید یا شخصا این کار را انجام دهید. متناوبا، ابزارهای تحت مرورگر نیز برای فشرده‌سازی خودکار داده‌های HTML قبل از ارسال آن به کاربران، وجود دارند.
تقریباً در همه موارد، گزینه دوم برای تجارت و وب‌سایت شما بهتر است. داده‌ها هنگامی که وب سرور شما را ترک می‌کنند فشرده شده و هنگامی که به مقصد می‌رسند از حالت فشرده خارج می‌شوند.
البته مواردی وجود دارد که فشرده سازی دستی منطقی‌تر است. به عنوان مثال، فرض کنید در مرحله کدنویسی و طراحی وب‌سایت هستید یا روی بهینه‌سازی سایت خود برای جذب ترافیک بیشتر تمرکز کرده‌اید. در این صورت، ممکن است در پلن هاست خود پهنای باند کافی برای توجیه فشرده‌سازی درون مرورگر، نداشته باشید. همچنین بررسی گزینه‌های مختلف فشرده‌سازی می‌تواند به شما کمک کند تا تشخیص دهید کدام روش بهترین سرعت و حجم را ارائه می‌دهد.
تصویر(4)
رایج‌ترین ابزار فشرده‌سازی که در حال حاضر توسط شرکت‌های میزبانی‌وب استفاده می‌شود gzip است. این ابزار از پروتکل آشنای HTTP جهت فشرده‌سازی خودکار فایل‌های HTML در وب سرور شما و خارج نمودن از حالت فشرده در دستگاه کاربر نهایی، استفاده می‌کند.
تمامی شرکت‌های میزبانی وب، از gzip یا روش‌های دیگر فشرده سازی HTML، استفاده نمی‌کنند. اگر شرکت میزبان فعلی یا آینده شما چنین ابزارهایی را ارائه نمی‌دهد، روش‌های دیگری را در نظر بگیرید. از طرف دیگر، می‌توانید از آنها بخواهید تا نوعی فشرده‌سازی را برای افزایش سرعت و کاهش حجم فایل‌ها، فعال کنند.
مواردی که هنگام فشرده سازی HTML باید از آنها اجتناب کرد
فشرده سازی یک فایل HTML مزایای زیادی دارد اما کمبودهایی نیز در آن مشاهده شده که باید از آنها آگاه باشید.
اولین نکته، مشکلات امنیتی احتمالی است. اگر از شرکتی که خدمات gzip را به واسطه HTTPS ارائه می‌دهد، استفاده می‌کنید، در صورت بروز نقص امنیتی، ممکن است وب‌سایت شما با مشکلاتی روبرو شود. در نتیجه، فایل‌هایی که دارای اطلاعات حساس هستند می‌توانند در معرض خطر قرار گیرند. به همین دلیل، باید از فشرده سازی فایل‌های حساس از طریق gzip، خودداری کنید.
همچنین اگر حجم فایل شما کمتر از مقداری خاص و صرفا چند بایت باشد، فشرده سازی می‌تواند بی‌اثر شود. در نتیجه باید مراقب باشید. در مرحله بعد، باید بررسی نمایید که فایل‌ها بیش از حد فشرده نشوند. فشرده‌سازی معمولی یا شدید، تفاوت چندانی در حجم فایل ایجاد نمی‌کند.
در نهایت، اطمینان حاصل نمایید که فایل‌های فشرده شده، مجددا فشرده نشوند. فشرده‌سازی مجدد، می‌تواند معکوس عمل کند و منجر به ایجاد یک فایل بزرگتر شود. از طرف دیگر، می‌تواند میزان قابل توجهی از حافظه را اشغال کند.
HTML را کوچک و ساده نگه دارید
هرچه فایل‌های HTML کوچکتر باشند، بهتر است. به خصوص وقتی صحبت از بهینه سازی وب‌سایت می‌شود. فشرده سازی یک فایل HTML، برای بهبود زمان لود صفحه و محدود کردن استفاده از پهنای باند، حیاتی است و مزایایی از جمله کاهش هزینه‌های میزبانی وب و بهبود تجربه کاربر نهایی را به همراه خواهد داشت.