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

حالا تصور کنید که همین صفحات وب عامل کندی و هدر رفتن وقت بشن. در این مطلب و مطالب مرتبط قصد داریم تا راهکارهای مٶ ثری رو برای افزایش سرعت بارگذاری صفحات وب بررسی کنیم.

در اولین قدم به بهینه سازی کدهای html میپردازیم.

تعریف بهینه سازی: به مجموعه اقداماتی که در راستای کاهش حجم اشغال شده توسط یک برنامه و همچنین افزایش سرعت دستیابی به اشیاء یک پرونده بهینه سازی گفته میشود.

یکی از بهترین راههایی که میشه سرعت لود یک صفحه html رو افزایش داد, کاهش دادن حجم فایل html هست. حالا اگر ما با کدهای html آشنایی کافی رو داشته باشیم میتونیم با استفاده از این مطلب یاد بگیریم که کی و چه موقع تگی رو استفاده بکنیم و یا چه موقع از تگی استفاده نکنیم.

در HTML و یا حتی نسخه جدید و سخت گیر تر اون XHTML گاهی اوقات شما اجازه حذف برخی تگ ها رو دارید که بودن یا نبودنشون هیچ تفاوتی ایجاد نمیکنه. در زیر لیستی از این تگها ارایه شده که شما میتونید اونها رو به دلخواه خودتون حذف کنید.(تگهایی که روی آونا خط کشیده شده تگهای خالی هستن. یعنی عملا هیچ محتوایی ندارن.)

  • </area>
  • </base>
  • <body>
  • </body>
  • </br>
  • </col>
  • </colgroup>
  • </dd>
  • </dt>
  • <head>
  • </head>
  • </hr>
  • <html>
  • </html>
  • </img>
  • </input>
  • </li>
  • </link>
  • </meta>
  • </option>
  • </p>
  • </param>
  • <tbody>
  • </tbody>
  • </td>
  • </tfoot>
  • </th>
  • </thead>
  • </tr>

برای مثال شما میتونید به جای استفاده از فرمت <li> List Item</li> از شکل کوتاه تر <li> List Item استفاده کنید. شما حتی میتونید تگهایی مثل <body> , <head> , <html> رو هم که وجودشون در HTML لازم نیست حذف کنید.

HTML 5

نسخه 5 html که هنوز در دست توسعه امکانات بیشتری رو برای کاهش حجم به شما ارایه میده.

برای مثال شما میتونید از حالت کوتاه شده اعلان DOCTYPE استفاده کنید:
<!DOCTYPE html>

به جای دستور طولانی و معمول اون در نسخه های پایین تر html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

یا مثلا زمانی که قصد دارد encoding مربوط به صفحه تون رو مشخص کنید به جای استفاده از دستور طولانی <meta http-equiv=”content-type” content=”text/html; charset=utf-8″>

از شکل کوتاه شده‌ی اون استفاده کنید.
<meta charset="utf-8">

مورد دیگه اینه که هنگام استفاده از تگهای script و یا style حتما لازم نیست که خاصیت type اون رو مشخص کنید.
<script>
به جای
<script type="text/javascript">

به طور کل اگر شما بتونید از نکات بالا به موقع و به صورت ترکیبی استفاده کنید قادر خواهید بود که بین 5 تا 20٪ از حجم فایلتون کم کنید و این خودش تأثیر به سزایی در سرعت لود صفحات شما در اینترنت داره.

برگرفته از مقالات آموزشی گوگل کد

q2njz6rwia

مطالب مرتبط: