Osfonder's blog Just another wd weblog

7Ноя/100

Mediawiki-database-schema

Mediawiki-database-schema

Метки записи: , Нет комментариев
20Сен/100

Авторское право ВКонтакте

Выдержка со страницы для правообладателей (http://vkontakte.ru/techsupp.php?fid=1&act=t&tid=299994)

Наиболее эффективной и принятой в Интернете формой взаимодействия является направление правообладателем владельцу Интернет-ресурса списка объектов интеллектуальной собственности, размещенных незаконно, списка URL-адресов их электронных копий (гипертекстовых ссылок), а также копий правоустанавливающих документов на объекты интеллектуальной собственности

Но ссылки на аудио и видео файлы, генерируются каждый раз новые. Более того действуют только для IP адреса запросившего компьютера. Это значит, что адресацию контента в сети определяет не только URL, но так же временной интервал и расположение компьютера.

27Июн/101

Eclipse и Dropbox. Организация единого рабочего пространства разработчика.

Тем, что сегодня разработчику приходится работать на нескольких компьютерах никого не удивить. У меня дома помимо нетбука еще два компьютера, причем с разными ОС(windows и ubuntu linux). Если понадобиться сесть за мак, то и там можно будет работать сразу и без проблем. Добился я этого таким образом.

  1. Итак, для начала необходимо установить Dropbox на рабочий компьютер.
  2. Переходим в Dropbox директорию и создаем там папку, например, workspace.
  3. Переходим в Dropbox директорию и создаем там папку, например, portable, а в ней папку eclipse.
  4. Скачиваем и разархивируем в неё дистрибутивы eclipse. (http://www.eclipse.org/downloads/packages/eclipse-php-developers/heliosr ссылки справа. На момент написания последняя версия — helios). Я скачал соответственно windows и linux версии.
  5. В папку с eclipse дистрибутивом закидываем папку JRE с Jav`ой
  6. Запускаем eclipse. В качестве рабочего окружения workspace выбираем, созданную ранее папку workspace в каталоге Dropbox.
  7. После запуска eclipse переходим в меню Window->Properences
    Далее на вкладке General->Startup and Shutdown выбираем Refresh workspace at startup. А на вкладке General->Workspace устанавливаем флажок Refresh automatically.

Вот, собственно, и всё. Теперь переходя на другой компьютер достаточно просто установит не него Dropbox и одним кликом запустить рабочее окружение, со всеми созданными проектами и открытыми файлами.

Посты по теме

Установка Dropbox на сервер из консоли

14Июн/102

Установка Dropbox на сервер из консоли

dropboxСейчас я расскажу о том, как установить Dropbox на сервер, используя только консоль.
Для чего вам это может понадобиться вы наверняка для себя определили сами, коль скоро сейчас это читаете. Для чего это сделал я, расскажу в следующем посте.

К делу

  1. Заходим на сервер в домашнюю директорию и скачиваем linux клиент Dropbox'a

    wget -O dropbox.tar.gz http://www.dropbox.com/download/?plat=lnx.x86
    

    или 64-битную версию

  2. Разархивируем, скачанный файл

    tar -zxof dropbox.tar.gz
  3. Запускаем клиент

    ~/.dropbox-dist/dropboxd &
    

    немного ждем, получаем ссылку
    и переходим по ней, чтобы прикрепить к своему аккаунту новый компьютер(сервер).

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

Для последующего запуска нужно использовать ту же команду

~/.dropbox-dist/dropboxd &

её следует добавить в /etc/rc.local например, для автозапуска при старте.

P.S. Для всей этой процедуры необходим, установленный на сервере Python.

Метки записи: , 2 Комментарии
20Май/100

Google Font Directory. Красивый веб

Hello World (выделяется)

Показать код

<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

<style>
  #hello { font-family: 'Lobster', arial, serif; font-size: 28px; text-shadow: 4px 4px 4px #aaa;}
</style>

<p id="hello">Hello World (выделяется)</p>

Поддерживаются браузеры:

  • Google Chrome: version 4.249.4+
  • Mozilla Firefox: version: 3.5+
  • Apple Safari: version 3.1+
  • Microsoft Internet Explorer: version 6+

Ресурсы на тему:

  1. Google Font Directory
  2. Начало работы
  3. FAQ
10Май/100

Способы ускорения загрузки страницы часть 3

Оптимизация структуры страницы

Внутреннюю структуру страницы можно бодро и весело разделить на три части: CSS стили, JavaScript код, HTML код. Точнее разделить ту часть, которая учавствует в генерации внешнего вида браузером.
И ничего удивительного в том, что от того как эти три составляющие организованны зависит то, как быстро пользователь увидит ваш сайт.
На удачу тут все канонично.

Размещайте CSS стили вверху

Проведенные исследования говорят о том, что размещение CSS стилей в теге <HEAD> позволяет браузерам прогрессивный рендеринг, то есть отображение HTML элементов по ходу их загрузки. Помещая CSS стили не в начало документа вы рискуете оставить посетителя наблюдать пустой экран пока не будут загружены стили. Дело в том, что многие браузеры не рендарят элементы пока не получат CSS во избежание двойной их отрисовки(без стилей и с ними).

Размещайте JavaScript код внизу

Внизу значит буквально перед закрывающим тэгом </BODY>. Браузеры согласно HTTP/1.1 спецификации не должны осуществлять более двух параллельных загрузок(картинки, CSS, JS) на доменное имя. Но они так же не будут начинать ни одну из внешних загрузок пока не будет загружен скрипт. Все изображения, стили и т.п. будут буквально ждать очереди пока не загрузиться JavaScript код.

Посты по теме

  1. Разработка сайтов: Процесс загрузки страницы
  2. Способы ускорения загрузки страницы часть 1
  3. Способы ускорения загрузки страницы часть 2
9Май/100

Способы ускорения загрузки страницы часть 2

Уменьшение объема передаваемых cookie данных

Разобравшись с ускорением за счет уменьшения количества HTTP запросов поразмыслим, как ещё можно оптимизировать структуру страницы дабы увеличить скорость её загрузки.
Согласно этапам процесса загрузки страницы, на стадии передачи данных браузером отправляются cookie с каждым запросом к внешнему файлу, будь то css, js или даже изображение. Таким образом по проводам гоняются лишние данные без особой на то причины. Способ избежать этого прост:

Выносить всю статику на домены не связанные с cookie

Это может быть сабдомен или вообще другой домен. И вы часто можете наблюдать это на больших ресурсах, когда изображения и скрипты подгружаются с чего-то вроде i.yandex.st, farm1.static.flickr.com, st.deviantart.net, l.yimg.com/g/css, l.yimg.com/g/javascript, ytimg.com.

Тут есть тонкость. Куки, установленные на домене верхнего уровня osfonder.ru будут передаваться на все поддомены js.osfonder.ru, css.osfonder.ru и т.п. Если вы хотите использовать поддомены для статичных файлов, то следует устанавливать куки на сабдомене www — www.osfonder.ru.
Другой способ — это купить отдельный домен для передачи через него всех статичных файлов для вашего сайта. Например у Yandex это yandex.st, у Yahoo! — yimg.com, у youtube.com — ytimg.com.

http://i.yandex.st/weather/i/1april/ruchka.gif


Знакомо ? )

Посты по теме

  1. Разработка сайтов: Процесс загрузки страницы
  2. Способы ускорения загрузки страницы часть 1
  3. Способы ускорения загрузки страницы часть 3
6Май/100

Перенос сайта архивом без доступа по ssh к целевому серверу

Имеем сайт разрабатываемый на вашем сервере. Заказчик хочет, чтобы размещался в итоге он не у вас и высылает доступ по FTP. Директория с сайтом у вас на сервере весит 46 мегабайт.

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

1. На нашем сервере переходим в папку сайта и создаем архив командой

tar cfz site.tar.gz *

теперь вместо кучи файлов общим весом 46 мегабайт имеем один в 18 (например).

2. Загружаем файл site.tar.gz на целевой сервер.

3. Создаем php файл распаковщик extract.php, содержащий одну строку

echo `tar xvf site.tar.gz`;

4. Переходим по ссылке http://newsite.tld/extract.php
результатом будет распаковка архива, в каталог на ФТП.

1Май/101

Способы ускорения загрузки страницы часть 1

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

В первой части:

Уменьшение количества HTTP запросов

Как говорилось в вышеуказанном посте для каждого внешнего файла, будь то JS скрипт, CSS стиль или фоновая картинка, устанавливается новое HTTP соединение, влекущее за собой затратные по времени процедуры.
Решение очевидно, нужно уменьшать до минимума количество таких запросов.

JavaScript файлы

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

Сжать несколько файлов в один, убрав лишние символы можно просто. Приведу один из инструментов, на который жаловаться не приходилось.
Это продукт от google — google closure compiler. Проще всего его использовать online (если размер файлов не превышает допустимых пределов), но можно использовать и стэндалон в виде java приложения у себя на компьютере.
Есть еще вариант который раньше очень был распространен dean edwards packer.

CSS стили

Тут абсолютно тот же способ, что и с js файлами — на этапе разработки разделяй и властвуй, но на "продакшн", где возможно, объединяй в один файл. CleanCSS в помощь.

Графические файлы

Тут есть два способа по уменьшению количества запросов.

1. Это т.н. технология спрайтов. Для всех не повторяющихся(no-repeat) изображений, используемых в дизайне мы создаем один, только один графический файл, куда помещаем их все, без зазора. В при указании бэкграунда, для элементов используем этот файл, устанавливая нужный фрагмент большого файла на фон позиционированием.
Для всех градиентов и прочего, что требует репита создается другой файл, шириной один пиксель. И опять же нужный фрагмент выбирается позиционированием.
Вот пример. Спрайт используемый на фэйсбуке (7.5 Кб)

2. Все небольшие изображения, вроде значков 8x8 пикселов и т.п. прописываются прямо в CSS или src изображения в виде base64 кодирования текста. Сложно? вот пример:


или для CSS:


Особенно такой способ в почете у однопиксельных градиентов.
Кодировщик (один из)

Посты по теме

  1. Разработка сайтов: Процесс загрузки страницы
  2. Способы ускорения загрузки страницы часть 2
  3. Способы ускорения загрузки страницы часть 3
Метки записи: , 1 комментарий
27Апр/100

Касперский и баннеры

Не формат, но злободневно и основываясь на опыте.

Если ваши партнеры жалуются, что их баннеры не показываются на вашем сайте, первым делом проверьте, что в именах файлов и путях к ним не присутствуют слова banners, ad, ads.
Такие файлы (но наверняка ими не ограничиваясь) блокирует Антивирус Касперского, удаляя их из трафика пользователей.

Чтобы исправить это нужно просто переименовать директории содержащие файлы баннеров, в что-то отдаленное например images_b, images_a.
Успехов.

Метки записи: , , Нет комментариев