Архив за Февраль 2009

  • Производительность браузеров в зависимости от верстки

    Один из моих докладов для конференции Clienttech 2008 (второй был про ictinus).

    У меня наконец-то дошли руки до описания известных мне проблем с производительностью в браузерах в зависимости от того, как сверстаешь страницу. Результаты тестов говорят сами за себя: Opera ни разу не «самый быстрый браузер на планете» (в моем рейтинге качества браузеров последние версии Оперы находятся примерно между IE7 и IE6), а восторженные вопли о быстрых JavaScript-движках я воспринимаю как говеный пиар. На кой черт мне сдались ваши ускоренные работы со строками и массивами, когда банальное изменение размеров картинки, даже не динамическое, вызывает жуткие тормоза? Почему разработчики браузеров не оптимизируют то, что действительно требует оптимизации? Спросите сами себя, для чего вы чаще используете JavaScript на сайтах: для работы со встроенными JavaScript-объектами или для работы c DOM? Ведь именно работа с DOM — самое узкое место современных браузеров.

    В этом свете мне наиболее близка позиция Майкрософта. Где-то, не помню где, они написали что-то вроде: «Оптимизировать работу чистого JavaScript будет только безумец».

  • Эмуляция position: fixed

    Способ эмуляции CSS-свойства position: fixed в IE6.

    На проверку этот способ оказался довольно глючным с точки зрения удобства пользования сайтом:

    1. при навигации вперед/назад по истории браузера страница не докручивается в то положение, откуда перешли на следующую страницу;
    2. страница не прокручивается при нажатии на пробел;
    3. на айфоне прокрутка не работает в принципе.
    Метки: ,
  • Eclipse: редактирование JavaScript в Spket IDE

    Демонстрация возможностей редактирования JavaScript в плагине Spket IDE.

    Метки: ,
  • Способ борьбы с «прыгающими» блоками в IE

    Володя Токмаков уже два раза освещал способы борьбы с этой напастью (способ 1, способ 2), я добавил третий.

    Вкратце, в чем заключается проблема: IE округляет дробные пиксельные значения, полученные из процентов, до наибольшего целого. То есть если у вас будет блок шириной в 101 пиксель, а внутри него будет два блока шириной в 50%, то ширина каждого блока будет 51 пиксель (101 / 2 = 50,5; округляем до наибольшего целого и получаем 51). Что естественно, в сумме больше, чем 101. В итоге последний блок переносится. Этот способ демонстрирует, как этого можно избежать.

    Особый кайф от статей в техногрете в том, что его читает много людей, а некоторые даже делятся своими решениями. В частности, Сергей Комаров прислал вот такое замечательное решение:

    <style type="text/css">
    	ul, ul li {
    		list-style-type: none;
    		margin: 0;
    		padding: 0;
    	}
    
    	ul {
    		width: 100%;
    		overflow:hidden;
    	}
    
    	ul li {
    		float: left;
    		clear: right;
    		width: 50%;
    
    		background:red;
    	}
    </style>
    <ul>
    	<li>item 1</li>
    	<li>item 2</li>
    </ul>
    

    Вратце, в чём суть: в данном случае есть три обязательных компонента — width: 100%, overflow: hidden и, самый важный, clear: right (я его поставил сейчас для всех элементов списка, но, если у них будут разные классы, то можно приписать это свойство только для последнего).

    Несмотря на небольшой недостаток (немного отрезается правый край у последнего <li>-элемента), способ очень и очень хороший. Спасибо всем остальным читателям, которые прислали такое же решение, но чуть позже.

    Метки: ,
  • Eclipse: знакомство, плагины

    Попытка агитации студийных разработчиков перейти на более высокий уровень разработки сайтов. На тот момент я пользовался Эклипсом около года и успел его немного изучить и проверить много плагинов к нему. Сразу скажу, что от этой IDE я далеко не в восторге, об этом будет отдельный пост.

    Метки:

← cтарое новое →