Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.07.2018, 20:29
Аватар для MC-XOBAHCK
Профессор
Отправить личное сообщение для MC-XOBAHCK Посмотреть профиль Найти все сообщения от MC-XOBAHCK
 
Регистрация: 06.08.2017
Сообщений: 473

Считается такое кешированием в JS
Будет ли правильным, если document сначала записать в переменную, а потом обращаться к ней. Типа вот так:
let doc = document;

let title = doc.querySelectorAll('h2');
doc.querySelector('.class').innerHTML = 'Hello World';
doc.querySelector('.test').addEventListener('click', ...)

Вроде где то в видео на ютубе услышал, а может приснилось, что это можно считать как кеширование и типа это значительно уменьшает нагрузки на браузер.
Или это неправильно?

Последний раз редактировалось MC-XOBAHCK, 23.07.2018 в 20:44.
Ответить с цитированием
  #2 (permalink)  
Старый 23.07.2018, 20:59
Аватар для Alexandroppolus
Профессор
Отправить личное сообщение для Alexandroppolus Посмотреть профиль Найти все сообщения от Alexandroppolus
 
Регистрация: 25.10.2016
Сообщений: 1,012

Сообщение от MC-XOBAHCK
значительно уменьшает нагрузки на браузер.
если и уменьшает, то на копейки
обращение к doc слегка быстрее, поскольку он в текущем скоупе, а за document надо ходить по всей цепочке скоупов на самый верх.

однако первый же querySelector делает такую оптимизацию смехотворной (поскольку в разы дольше обращения к переменной), не говоря уж об изменении DOM
Ответить с цитированием
  #3 (permalink)  
Старый 23.07.2018, 21:18
Аватар для MC-XOBAHCK
Профессор
Отправить личное сообщение для MC-XOBAHCK Посмотреть профиль Найти все сообщения от MC-XOBAHCK
 
Регистрация: 06.08.2017
Сообщений: 473

Я правильно понял что этим можно пренебречь и не заморачиваться, если после идёт querySelector и оставлять document.querySelector ?
Изменённый DOM не беру во внимание. Изначально всё прописано в HTML.
Ответить с цитированием
  #4 (permalink)  
Старый 23.07.2018, 21:43
Аватар для Alexandroppolus
Профессор
Отправить личное сообщение для Alexandroppolus Посмотреть профиль Найти все сообщения от Alexandroppolus
 
Регистрация: 25.10.2016
Сообщений: 1,012

MC-XOBAHCK,
если ты пишешь какую-то логику чисто на js и хочешь упороться и совсем всё оптимизировать, то да, вполне можно глобальные переменные в текущий скоуп подтянуть (особенно если к ним много обращений, внутри цикла, например).

А если на фронте ты работаешь с DOM, то понятное дело такие оптимизации будут вообще незаметны на фоне операций с элементами.
Ответить с цитированием
  #5 (permalink)  
Старый 23.07.2018, 22:26
Аватар для MC-XOBAHCK
Профессор
Отправить личное сообщение для MC-XOBAHCK Посмотреть профиль Найти все сообщения от MC-XOBAHCK
 
Регистрация: 06.08.2017
Сообщений: 473

Alexandroppolus,
Спасибо за разъяснения, я суть понял - буду знать.

А можно ещё спросить в этой теме такой вопрос:
инпуты с тайпом нумбер, если мышкой на родные стрелочки инпута жать (изменять значения), то очень долго уходит сигнал на событие - секунды 2-3 пока скрипт отреагирует.
Если стрелочками с клавиатуры (клавиши вверх-вниз) менять значения, то скрипт реагирует моментально на событие.
Это так и есть с такими инпутами или это уже я в скрипте накосячил?
Ответить с цитированием
  #6 (permalink)  
Старый 23.07.2018, 22:49
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

MC-XOBAHCK,
почитайте "Выразительный JavaScript" автор на протяжении всей книги пытается раскрыть тему баланса между выразительность кода и скоростью, где стоит использовать абстракции, а где опереться на более фундаментальные вещи. (хотя между строк читается что топит больше за красоту)
Ответить с цитированием
  #7 (permalink)  
Старый 23.07.2018, 23:45
Аватар для MC-XOBAHCK
Профессор
Отправить личное сообщение для MC-XOBAHCK Посмотреть профиль Найти все сообщения от MC-XOBAHCK
 
Регистрация: 06.08.2017
Сообщений: 473

Сообщение от j0hnik Посмотреть сообщение
почитайте "Выразительный JavaScript"
Если я ту книгу загуглил, думаю за пару дней прочту - там немного и почти весь материал что есть в этой книге я уже знаю.
Ответить с цитированием
  #8 (permalink)  
Старый 24.07.2018, 11:41
Аватар для MallSerg
Профессор
Отправить личное сообщение для MallSerg Посмотреть профиль Найти все сообщения от MallSerg
 
Регистрация: 07.03.2011
Сообщений: 1,138

Цитата:
Будет ли правильным, если document сначала записать в переменную, а потом обращаться к ней. Типа вот так:
копировать в буферпоказать чистый исходник в новом окнеСкрыть/показать номера строкпечать кода с сохранением подсветки
1
let doc = document;
Допустимым значением будет. т.е. код будет работать без ошибок. Но смысла в таком кешировании практически 0.
кеширование хорошо работает когда можно избежать многократного поиска одного и того же элемента документа сохранив на него ссылку (найдено поиском по форуму)
Ответить с цитированием
  #9 (permalink)  
Старый 24.07.2018, 14:16
Аватар для MC-XOBAHCK
Профессор
Отправить личное сообщение для MC-XOBAHCK Посмотреть профиль Найти все сообщения от MC-XOBAHCK
 
Регистрация: 06.08.2017
Сообщений: 473

Rise, хороший паттерн, буду пользоваться.
Единственное 9-ая строка в вашем коде, где querySelector объявлен как строка. В этом случае нельзя как и document объявить:
let q = querySelector;
, чтобы потом обращаться через точку d.q('h1') ? Или сокращение допустимо только как Вы написали?
Я пробовал когда то подобное делать, но у меня что то не заработало и я бросил тогда эту затею и писал портянку полностью.
Ответить с цитированием
  #10 (permalink)  
Старый 24.07.2018, 14:28
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

MC-XOBAHCK,
d.q('#selector');//Обращение к методу "q"
d[q]('#selector');//Обращение к методу "querySelector" из переменной "q"

https://developer.mozilla.org/ru/doc...g_with_Objects
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
js стиль render для react.js vflash Ваши сайты и скрипты 5 01.04.2016 22:57
Вакансия JavaScript разработчик / JS / Frontend developer (Санкт-Петербург) Сергей Грачёв Работа 0 21.09.2015 12:31
Пример тестовых заданий на js junior elshaarawy Учебные материалы 3 26.03.2015 15:17
Картинка обрабатывается js 4yBaK Общие вопросы Javascript 10 11.09.2011 09:28