Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #91 (permalink)  
Старый 29.05.2012, 12:01
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,021

Сообщение от devote
меня как будто не услышали
Ой, прости, наверно не до понял
__________________
Болтовня ничего не стоит. Покажите мне код. — Linus Torvalds
влад.куркин.рф
Ответить с цитированием
  #92 (permalink)  
Старый 29.05.2012, 12:04
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от B~Vladi
Ой, прости, наверно не до понял
да, наверно мне нужно русский выучить получше
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #93 (permalink)  
Старый 03.06.2012, 19:43
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

melky,
опробовал я твой вариант тот что ты указал в посте для мелких сайтов он конечно норм, но вот при большом количестве элементов на странице чуствуется довольно таки огромное падение производительности. Так как браузер перерисовывает документ при любых манипуляциях со стилями, даже если такого свойства нет в CSS то он вызывает все равно перерисовку.
Я вот накидал примерный селектор:
(function( window ){

	var stylesheet = document.createStyleSheet();

	function qSelector( selector ) {

		var elem, index = 0, result = [];

		if ( stylesheet.lastSelector !== selector ) {
			stylesheet.cssText = selector + "{testNativeSelector:1}";
			stylesheet.lastSelector = selector;
		}

		if ( stylesheet.rules.length && stylesheet.rules[ 0 ].selectorText !== "UNKNOWN" ) {

			var elems = document.getElementsByTagName( "*" );

			for( ;elem = elems[ index++ ]; ) {
				if ( elem.currentStyle.testNativeSelector ) {
					result[ result.length ] = elem;
				}
			}
		} else {
			throw new Error( "Syntax error: " + selector );
		}

		return result;
	}

	window.qSelector = qSelector;

})( window );
можешь потестить, при 2000 элементов на странице, задержка на 2-3 сек в ИЕ7 и 1-2 сек в ИЕ8
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #94 (permalink)  
Старый 03.06.2012, 20:15
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote
можешь потестить, при 2000 элементов на странице, задержка на 2-3 сек в ИЕ7 и 1-2 сек в ИЕ8
Само собой она будет. Скрипт же просто все элементы обходит.

Конечно, не панацея, но для "минимума" подойдёт. Я этот метод использовал как костыль matchesSelector.
Ответить с цитированием
  #95 (permalink)  
Старый 03.06.2012, 20:22
Аватар для FINoM
Новичок
Отправить личное сообщение для FINoM Посмотреть профиль Найти все сообщения от FINoM
 
Регистрация: 05.09.2010
Сообщений: 2,298

Сообщение от melky
Я этот метод использовал как костыль matchesSelector.
Ёпт, умно.
__________________
"Matreshka is fucking awesome" © чувак с Reddit
Matreshka.js - Три возможности
Ответить с цитированием
  #96 (permalink)  
Старый 03.06.2012, 20:41
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

FINoM, ?
Ответить с цитированием
  #97 (permalink)  
Старый 03.06.2012, 20:42
Аватар для FINoM
Новичок
Отправить личное сообщение для FINoM Посмотреть профиль Найти все сообщения от FINoM
 
Регистрация: 05.09.2010
Сообщений: 2,298

melky, я не догадался эту особенность IE так использовать.
__________________
"Matreshka is fucking awesome" © чувак с Reddit
Matreshka.js - Три возможности
Ответить с цитированием
  #98 (permalink)  
Старый 03.06.2012, 21:05
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
Скрипт же просто все элементы обходит.
да это понятно что проходит, ибо и не было бы нового свойства в стилях если бы не проходил. Проблема не в том что проходит, а в том что он во время прохода вновь пересчитывает все данные на элементы, одним словом изменив одно свойство CSS неважно существующего или нет, он заного делает перерасчет всех свойств элементов. За счет чего производительность падает чуть ли не в пять раз чем например выборка моего селектора QSA, то-есть в сравнении с ним скорость выборки получается в пять раз медленнее чем у моего скрипта. Вот если бы он просто нашел элементы, дал им новое свойство без перерисовки, тогда конечно же производительность выросла бы в разы. Но увы( это не так.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #99 (permalink)  
Старый 06.01.2013, 17:22
Аватар для viktorina
Профессор
Отправить личное сообщение для viktorina Посмотреть профиль Найти все сообщения от viktorina
 
Регистрация: 04.01.2013
Сообщений: 173

То есть спайк - это кроссбраузерные события, кроссбраузерный qSA?
Ответить с цитированием
  #100 (permalink)  
Старый 06.01.2013, 18:22
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от viktorina
То есть спайк - это кроссбраузерные события, кроссбраузерный qSA?
да именно, вот это будет работать и в ИЕ с библиотекой spike:
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="http://code.spb-piksel.ru/spike.min.js"></script>
    </head>
    <body>
        <div id="mydiv" style="width: 100px; height: 100px; background: #00ff00">Кликни по мне</div>

        <script type="text/javascript">
            document.querySelector('#mydiv').addEventListener('click', function(e) {
                alert("кликнули по элементу: " + e.target);
            }, false);
        </script>
    </body>
</html>
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
Ответ



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

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