Pull to refresh
3
0
Максим Коллегин @maxdm

User

Send message

Параллельная загрузка JavaScript и CSS без блокирования парсинга страницы

Reading time5 min
Views67K
Известно, что следуя идеям старой школы, а именно, добавляя ссылки на JS и CSS в страницы, может обернуться большим временем загрузки страницы. Браузер отображает страницу по мере скачивания, но останавливается, если натыкается на тег script со ссылкой, до того момента, пока скрипт не будет загружен и выполнен. Сайты стали использовать всё большее количество скриптов, начальное отображение страницы занимает всё больше времени, к примеру, на этой странице, которую вы читаете, 13 скриптов, 7 из которых находятся в head'е. Ко всему прочему, некоторые браузеры по-прежнему придерживаются ограничений на одновременное количество загрузок с одного хоста.

Сразу предлагаю принять, что все JS файлы минимизированы, и передаются в сжатом виде.

Существует несколько решений, как то:
— поместить стили и скрипты прямо в страницу;
— установка аттрибутов async/defer тегу script;
— склеить все скрипты в один файл;
— помесить ссылки на скрипты в конец body;
— разместить все файлы на CDN/на разных хостах;
— свой вариант…

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

Началось всё, конечно, с того, что я взялся за один проект, и в какой-то момент мне показалось, что простенькая страница достаточно долго загружается, и посмотрел на график загрузки, и на результаты YSlow. Огонь на секунду потух в моих глазах, но зная, что может быть лучше, я полез искать,
как сделать лучше.

Кроссплатформенность — это круто

Reading time8 min
Views30K
Этот пост участвует в конкурсе „Умные телефоны за умные посты“.

Ни для кого не секрет, что сегодня мобильные игры очень популярны. Возможность написать одну из таких игр есть у каждого разработчика, даже начинающего. Часто возникает вопрос с выбором платформы. Конечно, хочется, чтобы игра была сразу везде: на iOS и Android, на WP7 и MeeGo, на десктопе и в браузере. И чтобы все это можно было лекго реализовать с помощью бесплатных инструментов.



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

Выбор дешевого хостинга

Reading time2 min
Views34K
Так уж сложилось, что некоторое время назад мне пришлось выбирать дешевый хостинг. Обычный — PHP/MySQL, которых тыщи и на котором будут лежать пара десятков мелких сайтов...

Искал я всевозможные хостинг-конторы в гуглах, читал сотни отзывов на форумах, находил «черные» и «белые» списки, но мнения людей разнились. Тогда я решил сам проверить кто есть ху те хостинги, о которых больше всего слышал.

Я составил для себя список и начал анализировать основные параметры.
Пробовал некоторые сам, некоторые просто отбрасывал глянув на смешные тарифные планы.

Вот к таким выводам я пришел...

Зеркало справочных архивов Visual Studio 2010

Reading time2 min
Views3.2K

Введение

Одним из немногих полезных нововведений справочной системы Visual Studio 2010 (aka Microsoft Help System 1.1) является возможность установки и обновления архивов содержимого справки из онлайн-каталога. Однако, необходимость вытягивания порядка гигабайта архивов для каждой девелоперской машины может показаться накладной, поэтому было принято решение о создании локального зеркала онлайн-каталога. Найти официального способа решения данной задачи, к сожалению, не удалось.

Исследование

При помощи любого HTTP-сниффера (такого, например, как Fiddler) можно выяснить, что каталог расположен по адресу http://services.mtps.microsoft.com/ServiceAPI/products, при этом непосредственно архивы располагаются на сайте http://packages.mtps.microsoft.com/. Именно эти два ресурса и нужно будет зеркалировать.

Реализация

Читать дальше →

Hifidiy A20. Собираем усилитель мощности

Reading time4 min
Views128K

*Местами используются стоковые фото, по причине отсутствия своих в надлежащем качестве. Осторожно! На фото присутствует ковер, коврофобам не смотреть :) Очень много больших фото, трафик!

Приветствую! Как и обещал, расскажу о том как я мощник для акустики собирал. Так как промышленные варианты меня не устраивали, я нацелил свой выбор на diy варианты. Усилитель будет использоваться с полочной высокочувствительной акустикой, я решил что буду собирать усилитель мощностью 15-30 ватт, обязательно в A классе ( Да, да, вместо обогревателя ). Перебрал очень много проектов, остановился на клоне Krell KSA 50 — HifiDIY A20. Он полностью меня устроил, мощностью, габаритами, комплектующими. И я принялся за сборку.

Читать дальше →

DIY предусилитель в A классе. Клон Lehmann BCL

Reading time3 min
Views72K
image

Приветствую! После покупки наушников стал назревать вопрос о качественном усилении для них и я стал выбирать подходящие варианты, заводские решения отбросил сразу, по причине завышенной цены и достаточно дешевой элементной базы. Выбор пал на DIY варианты. Потом стал необходим предусилитель для усилителя мощности и я принялся за сборку. Мой выбор остановился на клоне Lehmann BCL, оригинальная версия достаточно известна, обладает достойным звуком, большое количество людей на заграничных форумах повторили эту конструкцию. Но усилитель очень чувствителен к качеству элементной базы, поэтому компоненты были использованы самые лучшие, до каких только смог дотянуться. Весь усилитель собран из деталей купленных на ebay. Прошу меня простить, но некоторые фото немного устарели, под ними я напишу что изменилось на сегодняшний день, начнем!
Читать дальше →

Как ускорить эмулятор Android на 400%

Reading time5 min
Views143K
Последние несколько месяцев я работал над SDK для Android, входящим в платформу управления контентом Nuxeo. Особенно много работы было в последнее время, с приближением официального релиза SDK. Я хочу поделиться несколькими практическими советами по поводу разработки под Android, в частности тестирования и эмуляции. Уже после нескольких дней разработки я понял, что работа с эмулятором Android — не сахар, потому что он чудовищно медленный.

Начнём с того что он медленно запускается, но даже если использовать для ускорения запуска снапшот состояния, выполнение кода все равно происходит медленно, особенно в режиме отладки.

Тонкая настройка параметров Qemu не слишком помогла — скорость работы эмулятора осталась медленной, возможно именно поэтому большинство разработчиков предпочитает использовать реальные устройства, подключенные по USB.

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

Удаление неиспользуемых сборок из .NET проекта

Reading time6 min
Views13K
Когда-то во время учебы в университете, преподаватель, проверяя лабораторную работу по C++, вдруг неожиданно для меня задал вопрос: “А зачем вам здесь #include “%имя_библиотеки%”? Вы можете пояснить, для каких частей кода нужна каждая директива include?” Та директива, что «бросилась ему в глаза», была добавлена при попытке использовать какой-то класс. Класс, видимо, не прижился в лабораторной и его использование было благополучно удалено, а include остался…

Программируя в С#, с использованием Visual Studio, мы так же сталкиваемся с неиспользуемыми директивами using. Но Visual Studio может помочь справиться с проблемой, достаточно для .cs файла вызвать команду “Remove Unused Usings”. Правда есть еще одно место, которое так же не мешало бы время от времени чистить. Это ссылки (References) проекта. Как ни печально, но для C# проекта такой команды нет. В MS Connect даже баг создали по этому поводу. А вот для VB.NET проектов такая функция есть (найти её можно в свойствах проекта), но по злой иронии судьбы для VB.NET проектов нет команды для удаления неиспользуемых Imports (usings в C#) :)

Подогреваемые жаждой сделать полезное коллегам, независимые разработчики решили написать небольшие расширения для Visual Studio. А тут еще и Extension Manager из Visual Studio 2010 так упростил процесс распространения расширений. Пример таких расширений можно найти здесь и здесь. Невозможно судить об алгоритмах, используемых в этих расширениях. Хотя не буду скрывать, что после того как первое расширение бессовестно удалило из проекта приличную часть реально нужных для компиляции сборок, мы все таки посмотрели его рефлектором… Разбираться со вторым уже не стали. В общем-то, проблема одинакова, а ключевое словосочетание можно найти в пред-предыдущем предложении: нужных для компиляции.

Читать дальше →

Rails 3 и SproutCore

Reading time3 min
Views1.2K
Привет! Есть такой замечательный JavaScript фреймворк под названием SproutCore. С помощью него можно довольно легко писать веб-приложения с приближенным к десктопному интерфейсом. Штука довольно популярная, используется например Apple в iWork.com. Под катом мы прикрутим SproutCore к последним рельсам.
Читать дальше →

Скромное руководство по прохождению интервью: часть 1

Reading time5 min
Views30K
Пост подготовлен с целью помочь программистам при подготовке к собеседованиям по программированию. Здесь рассматриваются все основные темы, которые, как минимум, желательно знать перед собеседованием. Использован собственный опыт, опыт и рассказы коллег, специализированная литература.
Некоторые рассмотренные здесь темы могут вообще не пригодиться некоторым программистам, а могут и быть обязательными, решать вам. Мой совет – старайтесь как можно больше изучать темы/разделы/аспекты указанные здесь.
И так, в качестве обязательных знаний:
  • Структуры данных
  • Алгоритмы и «концепции»
  • Язык программирования

Читать дальше →

10 примеров меню для web страниц

Reading time1 min
Views19K
image Эти способы не являются ноу-хау или чем-то в этом духе. Тем не менее, они могут помочь начинающим дизайнерам и web технологам в реализации задуманных ими идей. Каждый из предложенных вариантов можно обыграть по-своему.

Проверял лично и убедился в том, что исправно работает под следующими браузерами:

IE7+, Opera 10.5+, FF 3.6+, Chrome 12+ (linux), Chrome 13+ (windows), Safari 5+(win) исходя из личного опыта, предполагаю о том, что работать исправно будет во всех свежих версиях Safari, FireFox, Opera и Chrome.

С помощью CSS можно построить вот такие вот симпатичные варианты:


Читать дальше →

Использование Dummynet для эмуляции узкого канала под Windows

Reading time1 min
Views5.5K
Иногда нужно протестировать работу клиентского приложения в сетевых условиях, приближенных к боевым. Что при разработке, что при выборе софта. Как правило, сервер рядом, а нужно оттестировать и на таком канале, и на таком. Как ни странно, удобного средства управления трафиком (traffic shaping) под Windows мне долго не удавалось найти. Из поисков запомнилось: кто-то советовал для тестовых целей купить модем. Можно поставить роутером машину на Linux и на ней рулить трафиком, но мне такой подход кажется слегка чрезмерным.
Оказывается, не меньше года в проекте Dummynet есть бинарники для Windows, которые позволяют легко и непринужденно управлять, как минимум, полосой канала (bandwidth) и задержкой (latency).
Читать дальше →

Авторизация через ВКонтакте, Mail.ru и другие — 3 (ВКонтакте и OAuth)

Reading time3 min
Views33K
В прошлых двух частях мы сделали авторизацию через ВКонтакте, используя предоставленный ими javascript-виджет и через Майл.ру, используя как JS API, так и через взаимодействие сервер-сервер. Сегодня мы исправим наше упущение относительно ВКонтакте и рассмотрим авторизацию через ВКонтакте без использования клиентских javascript'ов.
В качестве ссылки на авторизацию мы можем использовать любой элемент, например картинку

, оформленную аналогичным образом со ссылкой на авторизацию через mail.ru.
Читать дальше →

Второе измерение: обзор поисковика авиабилетов Jizo.ru

Reading time6 min
Views13K
Российская авиация — интересная отрасль. Прогнувшаяся и уменьшившаяся в объёмах после распада СССР, она не уступает железным дорогам в объёмах пассажиропотока, и при этом гораздо свободнее и рыночнее: в отличие от «естественной монополии» РЖД, небо открыто для всех. А там, где есть конкуренция, есть место и выбору. Неудивительно, что в последние годы набирают обороты сервисы по поиску дешёвых цен на авиабилеты. Один из таких проектов, совсем «свежий» стартап от Fast Lane Ventures — мета-поиск дешёвых авиабилетов Jizo.ru. У проекта есть свои уникальные фишки, о которых я и расскажу в этом обзоре.



История создания


Jizo.ru (Джизо-точка-ру) назван в честь японского бога-покровителя путешественников. История создания проекта из разряда «в правильном месте в правильное время» — основатель компании, бывший директор по электронной коммерции и бывший технический директор компании Amargo, задумался о создании агрегатора авиабилетов тогда же, когда Fast Lane Ventures приняла решение о расширении своего инвестиционного портфеля за счёт подобного проекта. Инициатива встретила инициатора, и в мае этого года проект был запущен.
Читать дальше →

Как сделать один сайт для всех устройств (Responsive Web Design)

Reading time3 min
Views292K
Вчера была опубликована хорошая статья «Веб-дизайн. Каждому устройству свое представление». Несмотря на неплохие размышления, к сожалению, вывод в ней довольно глупый. А именно:

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

Почему это глупо


Во-первых, никто не сможет предугадать, какими устройствами будут пользоваться ваши посетители. Нужно ориентироваться не на устройства, а на разрешения.



Это скриншот из презентации «Beyond the mobile web by yiibu» (очень рекомендую).

Во-вторых, если вы не facebook или yandex, скорее всего, вы не потянете создание и поддержку разных версий сайта для каждого устройства. Да и это не имеет особого смысла. Потому что ситуация становится похожа на реалии пятнадцатилетней давности. Тогда делали сайт «под браузер», а сейчас автор предлагает делать сайт «под устройство».

Как сделать один сайт для всех устройств

Читать дальше →

Chosen: сделай выпадающие списки более дружественными

Reading time1 min
Views55K
Плагин Chosen создан для оформления красивых и удобных выпадающих списков с помощью jQuery и Prototype. Для установки плагина достаточно просто скачать файлы и прописать одну строчку:

$(".chzn-select").chosen()
(версия для jQuery)

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

Поскольку Chosen заменяет стандартный элемент HTML, то не нужно беспокоиться, как он работает с браузерами без поддержки JavaScript. Также не нужно ничего менять в бэкенде: формы сабмиттятся как обычно, изменения только в пользовательском интерфейсе.

Некоторые форки:
Chosen для MooTools
Модуль Chosen для Drupal 7

Imperavi: удобный и действительно красивый JS WYSIWYG редактор

Reading time1 min
Views22K
В продолжение темы о красивой и удобной JS визуализации (http://habrahabr.ru/blogs/javascript/124899/) хочу рассказать вам о WYSIWYG редакторе, на который сегодня случайно наткнулся.

Вы наверное часто используете различные WYSIWYG редакторы в ваших проектах. Я их тоже часто использую, так уж получается, что они очень нравятся секретаршам и т.д. нашим пользователям.

Таких редакторов существуют десятки, но все они мне почему-то не нравилисись: то выглядит уж очень топорно, то работает совершенно криво. В конце концов я остановился на TinyMCE. Он хоть и ужасен на вид, но рабоет стабильно.

И вот сегодня я совершенно случано наткнулся на редактор, который мне полностью подходит:
  • работает стабильно
  • выглядит очень стильно
  • написан на jQuery

Имя этому чуду – Imperavi.
Попробуйте сами и думаю, что вам понравится.

Скриншот:
image

UPD
Более новая версия редактора: http://imperavi.ru/redactor/.

Использование Amazon Web Services на примере wikipaintings.org

Reading time7 min
Views5.2K
Думаю, уважаемому сообществу будет интересно узнать о моем опыте разработки интернет проекта с использованием amazon web services.

Я не берусь утверждать, что весь проект идеален, однако я постараюсь описать основные решения, которые помогли сделать этот проект. Wikipedia.org, которая нас вдохновляла на работу, отдает 12 миллиардов страниц в месяц и поэтому мы старались с самого начала готовить код к росту популярности.

Что такое wikipaintings.org — www.wikipaintings.org/ru/About
Сейчас заканчивается первый этап разработки и основные задачи следующего этапа — привлечение волонтеров к наполнению сайта.

Если кому-то кажется, что картины – это скучно, оцените творчество Archimboldo — www.wikipaintings.org/ru/giuseppe-arcimboldo/spring-1573#supersized-artistPaintings-184903

Если же вам интересно наконец-то понять классификацию стилей живописи, добро пожаловать на www.wikipaintings.org/ru/paintings-by-style

Ну а теперь, после того как вы положили сайт Хаббраеффектом (если еще не положили – кидаем ссылку всем друзьям), давайте перейдем к главному – техническим советам.

Читать дальше →
12 ...
19

Information

Rating
Does not participate
Location
Москва, Москва и Московская обл., Россия
Registered
Activity