Оптимізація JS і CSS коду сайту

  1. Що таке JS і CSS код?
  2. Для чого потрібно оптимізувати JS і CSS код?
  3. Оптимізація JS і CSS коду

Всім-всім привіт!

продовжуємо оптимізувати швидкість завантаження сайту і сьогодні на черзі у нас оптимізація JS (JavaScript) і CSS коду. Нагадаю, вчора ми працювали з зображеннями, якщо Ви все ще не оптимізували їх, то 105 урок як раз для Вас (обов'язково застосуєте то, що написано там).

Урок вийде коротким, тому швидше за почнемо. Погнали!

Що таке JS і CSS код?

В даний час сайт, створений виключно на HTML і CSS, вже є відстаючим, адже на цих мовах не можна написати якісь зручні, корисні штуки, які полегшили б взаємодію з ним. Користувачам, в свою чергу, необхідно піднести максимально зручний продукт (веб-ресурс). Здійснити цю вимогу допоможуть різні мови програмування, до яких відноситься і JavaScript.

JavaScript - це мова програмування, що дозволяє створювати різні скрипти (додатки), які вбудовуються в HTML-сторінки. Скрипти виконуються в браузері користувача.

Щоб вивести навіть той самий горезвісний лічильник часу буде потрібно JS. Так що, думаю, і на Вашому сайті присутня дана мова програмування.

CSS - мова опису зовнішнього вигляду будь-якого елементу сайту. Тобто те, як виглядає Ваш сайт, мій сайт, та будь-який інший, написано на цій мові.

Для чого потрібно оптимізувати JS і CSS код?

Завдання даного заходу одна - знизити час завантаження сторінок сайту. На жаль, JS-скрипти і CSS код часто несуть в собі дуже багато символів, пробілів, ніж та уповільнюють завантаження веб-ресурсу. Оптимізація подібних файлів спрямована на те, щоб відсікти зайві символи, зайві прогалини, тим самим знижуючи їх розмір і, як наслідок, полегшуючи завантаження веб-сторінок. По суті відбувається звичайне стиснення файлу. Можна зробити і більш глибоку оптимізацію, якщо, звичайно, Ви розбираєтеся в програмуванні та сайтобудування.

Оптимізація JS і CSS коду

В Інтернеті, як і в випадку з оптимізацією зображень, існує кілька онлайн-сервісів, які виконують те, що написано вище:

  1. JSCompress . Працює виключно з JavaScript; Всім-всім привіт
  2. Refresh-SF . Дозволяє оптимізувати як JS, так і CSS, а також працює з HTML.

Ваше завдання: скопіювати код файлу, вставити його в один з перерахованих сервісів, отримати оптимізований код і вставити його в вихідний файл. От і все.

Попереджаю: після оптимізації код стане не читабельним, тому подальша робота з ним буде трохи ускладнена.

оптимізуючи свій блог , Я спробував обидва сервісу: в перший залив проблемний файл JS, а в другій CSS ( як дізнатися проблемні файли? ) І буквально через 5 секунд код оптимізувався і вже можна було заливати, що я і зробив.

Робота з перерахованими вище онлайн-сервісами не повинна викликати будь-яких не було труднощів, проте рекомендую зробити резервну копію проблемного файлу, щоб в разі виникнення помилок можна було повернути все в початковий стан.

На цьому все, дорогі друзі!

До зустрічі!

Що таке JS і CSS код?
Для чого потрібно оптимізувати JS і CSS код?
Що таке JS і CSS код?
Для чого потрібно оптимізувати JS і CSS код?
К дізнатися проблемні файли?