Как Microsoft делала Live

Специалист из Microsoft, Scott Isaacs, набрался опыта в процессе разработки Live.com и поделился такими соображениями:

1. Контролируйте кол-во соединений с web-сервером

AJAX довольно прожорлив в плане конектов сам по себе. Если вы строите динамический интерфейс в стиле gmail, то «дергать» сервер приходится постоянно чтобы иметь актуальные данные на клиенте.

Скотт, также столкнулся с проблемой проверки кэша для картинки, которая была вставлена в страницу динамически. IE проверяет кэш для такой картинки каждый раз при её появлении на экране. Поэтому рекомендуется загрузить картинки в IE перед тем как их использовать. приблизитльно так:
<script>
preload_images(‘img1.gif’,’img1.gif’)
function preload_images(){
for (var x=0; x<preload_images.arguments.length; x++){
imar[x] = new Image();
imar[x].src = ‘img/’+preload_images.arguments[x];
}
}
</script>
2. Избегайте использования XML на клиенте

Браузеры тяжело разбираются с XML-ем в javascript-e. Поэтому без лишней необходимости с большими xml-ями лучше на клиенте не работать. На серверной стороне live.com RSS каналы хранятся в нормализированном виде (судя по всему в базе), на клиент передается лента в JSON формате.
Для сравнения приводится время обработки 150кб RSS канала на клиенте: в XML — 400ms, в JSON — 15ms.

3. Контент надо кэшировать

Content-expiration надо ставить на все, за исключением данных, которые обновляются ежесекундно.
Очень важное замечание, но скорее как дополнение к первому пункту.

4. Разбивайте процесс загрузки приложения на модули

Для крупных AJAX приложений процесс загрузки модулей необходимо разделять и выполнять по необходимости.
Изначально загружаются только базовые бибилотеки, затем в случае необходимости модули Drag-n-Drop, затем RSS-библиотеки и т.д.
Действитльно правильный подход, помнится был где-то органайзер в стиле web2, который грузил два мегабайта внутренних JS-библиотек прежде чем показать окно регистрации.

5. Старайтесь не генерировать html на сервере.

Первичные шаблоны html-я могут быть загружены на первых этапах, но в дальнейшем их наполнение необходимо производить на основе мета-данных полученных через xmlhttp.

В дополнение к авторским пунктам:


6. Не забывайте о gzip, но и не увлекайтесь им.JS библиотеки и СSS очень полезно сжать gzip-ом и поставить разумный content-expiration.
Если вы придерживаетесь пункта 5 и у вас презентационный уровень представлен в виде HTML, а наполнение происходит данными из xmlhttp запросов, то HTML-шаблоны также имеет смысл сжать gzip-ом.
Сжатие динамических данных только излишне нагрузит процессор.

7. Обозначте понятие midia-хоста.

При планировании архитектуры вынесите медиа-сервер для хранения фото, видео или пользовательских файлов на отдельный хост. Так, чтобы загрузка у вас была не из «/video-store/myvideo.avi», а с «http://media1.mydomain.com/video-store/myvideo.avi&#187;

8. Забудте о всех нормальных формах баз данных:) ознакомьтесь с идей Lucene.

Август 24, 2006 at 1:35 дп 20 комментариев(я)

Увеличение быстродействия сервера в условиях WEB2 — склейка картинок

Большенство программистов не особо задумываются о производительности добавляя еще пару смайликов в web-интерфейс.
Вот небольшой анализ процесса загрузки трех смайлов:

smile11.gifsmile2.gifsmile31.gif

Поодиночная загрузка картинок:

  • все картинки в сумме занимают 601+604+607 = 1812 байт
  • с заголовками ответов сервера: 850+853+856=2559 байт
  • плюс заголовки get-запросов на загрузку картинок: 578*3=1734 байт
  • количество конектов к серверу: 3

И того ваш сервер принял 1734 байт и отдал 2559, при этом браузер открыл три сессии, а ваш сервер все отработал.

Теперь склеиваем три смайла в один gif и смотрим статистику.

combined_smiles.gif

Загрузка склееной картинки:

  • чистый размер картинки 960 байт
  • с заголовком ответа: 1209 байт
  • заголовок get-запроса: 587 байт
  • количество конектов к серверу: 1

Три картинки конечно роли не играют, но когда ваше решение содержит сотни графичесих элементов и вопрос контроля конектов, которые тратятся даже на проверку актуальности кэша, стоит очень серьезно, данный подход может пригодится. (коннектов то мало осталось, все уже на AJAX ушли:) )
Разрезать картинку на три состовляющих на клиенте особо труда не составляет, все делается через CSS:

<style type=»text/css»>
img.smiles{
width:16px;
height:16px;
background: url(combined_smiles.gif);
}
img.s1 {background-position:-32}
img.s2 {background-position:-16}
img.s3 {background-position:-0}
</style>

<img src=»px.gif» class=»smiles s1″ />
<img src=»px.gif» class=»smiles s2″ />
<img src=»px.gif» class=»smiles s3″ />

px.gif — наш старый добрый прозрачный пискель размером в 10 раз меньше чем заголовки сервера.

Вот на такие мысли натолкнула заметка Combine Images to Save HTTP Requests

Август 23, 2006 at 6:56 пп 5 комментариев(я)

Nimbuzz.com — почти Skype для мобилок

Полезный сервис обнаружил на MobileCrunch.

По задумке авторов приложение должно предоставить двум миллиардам пользователей мобильных сетей возможность общения с одним миллиардом пользователей Интернета и наоборот. Вот что я обнаружил, загрузив J2ME приложение на свою Nokia 6670…

Nimbuzz поддерживает, дословно, – voice, presense, messaging.

Как выяснилось Voice это именно voice, а не voip – позвонить можно любому контакту, но только по стандартной схеме – кнопочка call активизирует функцию набора номера в телефоне и платить вам прейдется по тарифам оператора. Можно поставить крест на страницу восторгов автора статьи на MobileCrunch по поводу INCREDIBLE SOUND QUALITY. (в принципе и не стоило ожидать большего от j2me приложения).

После регистрации вы получаете внутренний ник — @nimbazz, и можете добавить себе в контакты знакомых из того же пространства, либо из Google Talk-а, MSN-a, в будущем Yahoo и Jabber-a

Messaging реализован отлично, без лишних наворотов, всё очень аскетично, понятно и удобно. Сообщения можно отправлять как в режиме чата так и sms-like. Приложение можно отставить открытым или убрать на задний план, оставив включенным, при этом входящие сообщения будут напоминать о себе звонком или виброй (на ваше усмотрение). В таком состоянии трафика должно потребялется совсем немного, так что, как заменитель SMS приложение может быть полезным (ограничения длины сообщения я кстати не обнаружил, но это скорее зависит от конкретной модели телефона)

Presense – Nimbuzz действительно отображает кто сейчас в онлайне, а кто нет. Очивидная по необходимости функция в компьютерных месенджерах, здесь оказывается также полезна.

Трафик – в наших условиях самый важный вопрос. На авторизацию было потрачено 4кб трафика, по два кб на входящее и исходящее направления. Сколько кушает месенджер в спящем режиме пока не проверял, оставляю на ночь включенным – если утром не поседею, то отмечюсь

Из замеченных недостатков:

  • нет версии под PocketPC
  • нет анкеты пользователя, возможности найти друзей по интересам, региону и т.д. соц.сеть отсутсвует напрочь
  • нет русской версии
  • на сайте разработчика не работает ни форум, ни вики, ни блог. Контактов обнаружить не удалось

p.s. кто будет тестить, мой ник – gik. пишите

утро: за ночь приложение накачало аж 1,5кб! Интересно было бы посмотреть как изменится это число будь у меня 50 контактов, а не один. Также стоит заметить, что большенство телефонов не может одновремено держать GPRS и голосовой каналы, поэтому при разговоре GPRS связь прерывается, а значит приложение будет авторизироваться на сервере заново. Т.е. каждый звонок, вам будет нагонять дополнительно пару кб.

Август 22, 2006 at 11:09 пп 45 комментариев(я)

news2.ru — каким его хотелось бы видеть

news2_ru.jpgДумаю всем читателям моего блога знаком сайт news2.ru , наш аналог digg.com.

Проект молодой, но довольно перспективный, при условиях если наберет достаточную массу пользователей. Пока там людей совсем мало.

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

Предложение такое:

  • для зарегистрированных пользователей выводить на первой странице только те новости, которые им не были оценены.
  • исходя из первого пункта добавить возможность поставить нейтральную и отрицательную оценку новости. (и возможность поставит ьнейтральную оценку всем новостям, если меня например месяц не было и читать всё желания нет)
  • для анонимных пользователй показывать новости добавленные за день в порядке убывания их приоритета. (фильтр «важные новости сегодня»). Для авторизированных пользователй предоставить возможность посмотреть на первую страницу как анонимным
  • добавить еще несколько фильтров: важные новости за вчера, за неделю, за месяц, за всё время.

p.s. желающим поддержать данное мнение прошу голосовать тут

Август 21, 2006 at 7:33 дп 8 комментариев(я)

Toodoo, скорее мертв чем скорее WEB2

Пару дней назад зарегистрировался в Toodoo, русскоязычном проекте, ставящем цель объединить посетителей различных ресурсов.

По заявлению авторов, в Toodoo вы можете:

  • Завести свой профиль, указав множество параметров, по которым тебя смогут найти другие участники toodoo
  • Получить удобный инструмент идентификации на десятках популярных сайтов
  • Найти интересных собеседников в профессиональной сфере
  • Возобновить утерянные связи с однокашниками
  • Познакомиться с такими же, как ты читателями твоих любимых сайтов

Ничто из перечисленного меня особо не заинтересовало, но регистрацию всё таки прошел и даже оставил запись о своем блоге — http://toodoo.ru/blog/3344/index

toodoo.jpg

В плане реализации сайт довольно неплох — дизайн приятен, сайт рисуется быстро, очень в меру AJAX-а. Общая оценка реализации — пять балов. Из недочетов отмечу:

  • не работающие переходы по страницам при навигации в разделе «Сайты и Блоги»
  • отсутствие раздела помощи, точнее, его присутствие в виде пустой ссылки.
  • раздражающая beta в логотипе сайт (когда же разум к нам вернется)

На этом хорошие новости заканчиваются и начинаются плохие.

  • Найти для себя, вроде как продвинутого сетянина, причин пользоваться проектом я не нашел.
  • Разумной бизнес модели, кроме как банальной рекламы, для которой нужна ой какая немаленькая аудитория, тоже нет — ни у меня, ни, как выяснилось, у авторов:

Лично вы получаете ли вы какую-нибудь прибыль от этого проекта? - Этот вопрос приходится слышать часто в Рунете: «Откуда выбудете брать деньги? На чем здесь зарабатывать? Какие бюджеты сюда вложены?» Почему-то для многих людей ключевым является фактор денег: кто платит и откуда будет прибыль. Для нас на данный момент более важно реализовать свои замыслы по построению работающей социальной модели на основании нашего уникального подхода по объединению людей. Вопрос получения прибыли сейчас неуместен. Все члены нашей команды понимают: даже гениальная идея умирает при плохой реализации. Мы приложим все усилия для того, чтобы как раз реализация была на должном уровне. Если этого удастся достичь — прибыль придет. Но в ближайшей перспективе мы считаем разговоры о ней просто неэтичными.

из интервью Александра Толкачева (internet.ru) и Виктора Захарченко (директор по развитию toodoo)

Желаю команде toodoo удачи в нахождении бизнес модели и пересмотре функционала сайта.

Август 20, 2006 at 10:21 пп 31 комментариев(я)

Считаем Google PageRank на пальцах

Обнаружил у господина lasto.com занимательную математику по расчету PageRank-а

PageRankСмысл математики такой — если вы ставите 101-у ссылку со страниц с Google PageRank равным 5-ти, то результирующий PageRank будет 6.

Значение N может быть и нулевым, как пишет автор:

«Заметим также, что для получения второго ПейджРанка ньюберскому сайту потребуется целых 555 внешних ссылок с совершенно не котирующихся страниц, известных, однако, Гуглу.«

Интересно, как рабоют ранки у Yahoo и Microsoft-овского MSN-а. У первого, помнится, был WebRank,который они похоже закопали, по крайней мере для публики.

Август 19, 2006 at 3:32 пп 3 комментариев(я)

Архитектура Yahoo, Wikipedia, LiveJournal

Еще несколько ссылок на презентации и статьи об архитектуре и оптимизации производительности больших систем.

Yahoo
http://public.yahoo.com/%7Eradwin/ — Как устроен Yahoo и как настроить yApache для обработки 4 миллиардов показов страниц в сутки

Wikipedia
http://meta.wikimedia.org/wiki/PHP_caching_and_optimization — кэширование и оптимизация
http://meta.wikimedia.org/wiki/Cache_strategy — стратегия кэширования
http://meta.wikimedia.org/wiki/Wikimedia_servers — на чем работает wikipedia

LiveJournal
http://community.livejournal.com/lj_backend/ — как развивался ЖЖ (до ноября 2004)

Предыдущий набор ссылок oб архитектуре Flickr, LiveJorunal и оптимизации различных компонент системы — Производительность в WEB2

Август 19, 2006 at 8:29 дп 6 комментариев(я)

Предыдущие записи


RSS Мобильные Новости

  • Произошла ошибка; возможно, лента недоступна. Повторите попытку позже.

Наш архив

Свежие записи

Статистика

  • 16,932 посетителей

Отслеживать

Get every new post delivered to your Inbox.