Есть такой браузер (не будем тыкать пальцем), который при работе над проектом постоянно старается испортить тебе жизнь. В случае с проектом rocon таким браузером оказалась Opera.
Сначала она упорно не хотела показывать половину созданных уголков, прочухивалась только тогда, когда я переключался между окнами либо скроллил документ (ау, Опера! такие баги тянутся еще с 7 версии). Чтобы исправить это, нужно было вызвать repaint всего документа. Самым безобидным оказалось такое решение:
document.documentElement.style.outline = 'none';
Но, как оказалось, это было только началом эпической ебли с браузером. Решил проверить работу библиотеки на существующем проекте: добавил где-то 50 блоков на один из своих сайтов. Во всех браузерах уголки создавались где-то за 0,6 секунды. Проверил в Опере — 23 секунды. Около часа понадобилось чтобы найти проблемное место: оказалось, что на скорость повлияло свойство overflow: auto у одного из родительских элементов. Когда я его убрал время создания снизилось в 2—3 раза (не помню точно, на сколько именно, но прирост в скорости был существенным). На тот момент я немного подзабил на rocon, так как было много важных дел. Сегодня решил продолжить работу и начал с попытки воссоздать ту ситуацию с overflow, чтобы найти решение проблемы. У меня ничего не вышло: обычный родительский блок с overflow: auto давал ту же скорость, что и блок без него. Вероятно, проблема в макете сайта «дополнялась» другими элементами и стилями, разбираться в которых было лень (там HTML и CSS-кода килов на 200).
До истинной (как мне кажется) сути проблемы допер совершенно случайно, потратив еще минут 30 драгоценного времени. Я уже знал, что узким местом в rocon являлось получение текущего значения CSS-свойств элемента через getComputedStyle(). Проблема оказалась в следующем: тормозит одновременная модификация дерева документа (создание новых элементов) и получения стиля. То есть если разбить один цикл на два — сначала создаем все элементы, потом получаем их свойства — все работает замечательно. Для любопытствующих выложил пример.
И эти люди обвиняют Майкрософт в том, что IE тормозит развитие интернета.
