1 Тема від playdog

  • playdog
  • Користувач
  • Поза форумом
  • Дата реєстрації: 24.09.2017
  • Повідомлень: 2
    • Репутація: 0

Тема: Просте питання main.js

Підкажіть новачку, конкатинований main.js може вміщувати скрипти від всіх html-сторінок чи кожна сторінка повинна мати свій загальний скрипт?  *DRINK*

2 Відповідь від koala

  • koala
  • koala
  • Лінива тваринка
  • Поза форумом
  • Дата реєстрації: 01.05.2013
  • Повідомлень: 15 617
    • Репутація: 13330

Re: Просте питання main.js

Немає спеціальної назви файлу main.js. Тобто конкретно у вас він може бути, але в інших - не факт.
Я так розумію, ви хочете спитати, чи має сенс винести всі скрипти на сайті в один файл? Так, певний сенс є - якщо ви розраховуєте, що відвідувачі вашого сайту будуть переходити по кількох сторінках, а значна частина коду js спільна (якась бібліотека, той самий jquery, скажімо), то є сенс так зробити, особливо якщо його мініфікувати, а сервер налаштований стискати відповідь і радити кешувати цей файл надовго. Але тоді виникають інші проблеми:
- будь-яка зміна будь-якого скрипта на одній сторінці тягтиме за собою зміну всього main.js (а відтак - мініфікацію і перекешування);
- скрипти мають не заважати одне одному.
Якщо ви розумієте, як із цим впоратися - то звісно, виносьте все в один файл. І css також.

Подякували: FakiNyan, playdog, Monolith, ostap34PHP4

koala вебсайт

3 Відповідь від playdog

  • playdog
  • Користувач
  • Поза форумом
  • Дата реєстрації: 24.09.2017
  • Повідомлень: 2
    • Репутація: 0

Re: Просте питання main.js

Дякую за відповідь.
В мене є проблема. В конкатинованому js файлі є спільні і не спільні скрипти з різних сторінок. Скрипти, котрі знаходятся нижче цього(див. нижче) в коді не працюють. Але тількі ті, котрі з інших сторінок. Спільні скрипти на сторінці works.html остаються робочими.

var newsbtn = document.querySelector('.work__list');
newsbtn.addEventListener('click', function (event) {
  event.preventDefault();
    newsbtn.classList.toggle('work__list--show');
});

Є аналогічний скрипт, тільки клас інший, на index.html котрий також припиняє роботу скриптів на інших html-сторінках окрім своєї.
Окремо всі скрипти працюють і не мають семантичних помилок. Елемент .work__list є в html на момент 'click'.

В консолі показані помилки з null тільки про тих скриптів, котрі належать іншим сторінкам, що є логічним.
Щось можете порадити?

Я бачу 1 вихід: всі скрипти, котрі не руйнують працю один одного конкатинувати і мініфікувати в загальний js файл. А ті що руйнівні - в окремих тримати. Скрипти дуже прості і сумно що їх потрібно по разним файлам розкидувати(

4 Відповідь від koala Востаннє редагувалося koala (25.09.2017 12:29:20)

  • koala
  • koala
  • Лінива тваринка
  • Поза форумом
  • Дата реєстрації: 01.05.2013
  • Повідомлень: 15 617
    • Репутація: 13330

Re: Просте питання main.js

Питання перше. Цей фрагмент коду взятий з якоїсь функції чи прямо розташований у файлі? У другому випадку ви засмічуєте спільний простір імен. Загальна практика робити

(function(){
/*ваш код*/
})();

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

playdog написав:

Елемент .work__list є в html на момент 'click'.

а не, скажімо, що цей елемент є на сторінці до виклику скрипта, то мені здається, що на момент виклику його не існує (це лише припущення, яке ваш допис не дає можливості спростувати), а отже, document.querySelector('.work__list') повертає null, на який жоден обробник, звісно, не вішається.
Розміщення коду в onload вирішує купу проблем.

koala вебсайт

5 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: Просте питання main.js

ви уточніть - мова йде про http 1 чи http 2 ?
останній підтримує (тобто сучасні браузери) мультиплексування при завантаженні файлів,
відповідно потреба все збирати в один файл - відпала

точніше, це зайва і шкідлива робота на сьогодні

https://uk.wikipedia.org/wiki/HTTP#HTTP.2F2
2!! джва роки пройшло, відколи стандарт прийняли, люди!
навіть у вікіпедію встигли додати про це  :D

Мультиплексування і розпаралелювання потоків в рамках одного TCP-з'єднання. Пакети різних потоків змішуються і, на відміну від конвеєрної передачі HTTP/1.1, не очікують закінчення відправлення запиту. Підтримка ефективної двобічної передачі даних. Можливість мультиплексування при зверненні до різних хостів, що дозволяє додатково прискорити одночасне завантаження веб-контенту з різних сайтів (у SPDY мультиплексування підтримується тільки для одного хоста);

і тд

прокидайтеся) чи ви все підтримуєте лайно мамонта IE6 ?
тим більше прокидайтеся!!

Подякували: koala, Monolith2

221VOLT вебсайт

6 Відповідь від koala

  • koala
  • koala
  • Лінива тваринка
  • Поза форумом
  • Дата реєстрації: 01.05.2013
  • Повідомлень: 15 617
    • Репутація: 13330

Re: Просте питання main.js

Про HTTP/2 треба не тільки браузер питати, а й веб-сервер. Гілка Apache 2.2 все ще підтримується, а вона не вміє HTTP/2.
Крім того, більше файлів все одно створює більше навантаження на веб-сервер, навіть у HTTP/2. Воно безумовно зменшилося, але варто було б провести бенчмарк, щоб подивитися, наскільки.

Подякували: 221VOLT1

koala вебсайт