Главная/ Учимся Javascript, CSS, HTML/ Тоже нужно знать/ Twenty Things About Browsers And Web/ Эволюция к быстрому Веб или Ускорение изображений, видео и JavaScript в Веб

Эволюция к быстрому Веб

Дата публикации: 11.12.2010

или Ускорение изображений, видео и JavaScript в Веб

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

Эволюция к быстрому Веб

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

Насколько больше кода в современной веб-странице и насколько он сложнее?

  • С точки зрения веса страницы изображения и фотографии составляют около 65% информации на типичной веб-странице.
  • 24 часа видео в минуту загружается на YouTube каждый день. Для сравнения — это тоже самое, если бы Голливуд выпускал 130 000 новых полнометражных фильмов в неделю. В случае с YouTube разве что попкорна меньше.
  • Код JavaScript вырос с нескольких строк до нескольких сотен килобайт, который должен быть обработан каждый раз, когда загружается страница или веб-приложение.

Не замедляет ли весь этот увеличивающийся поток данных процесс загрузки веб-страницы в браузере? Интернет скоро переполнится и превратится в один сплошной неуправляемый поток?

Скорее всего, нет. Фотографии и картинки стали уже привычным делом в Сети и программисты научились уменьшать их вес, чтобы ускорить и облегчить загрузку. GIF и JPEG были самыми популярными из ранних способов сжатия файлов. Между тем, появились плагины, которые позволили встраивать и проигрывать видео прямо на веб-странице, обходя ранние ограничения HTML.

Забегая наперед по поводу видео: тег <video> в HTML5 позволяет легко встраивать и проигрывать видео на веб страницах. Google также тесно сотрудничает с сообществом над проектом WebM, чтобы создать свободный видеоформат с открытым исходным кодом, который сам способен подстраиваться под пропускную способность сети и мощность устройства, обеспечивая тем самым доступ к качественному видео как с компьютера на какой-нибудь ферме в Небраске, так и со смартфона в Найроби.

И в тоже время правда, что и сегодня страницы с большим количеством фотографий или других изображений могут загружаться очень медленно. Именно поэтому разработчики Google активно экспериментируют с разными способами сжатия изображения, сохраняя при этом его качество. Каковы результаты? Они очень многообещающие: был придуман новый формат изображения под названием WebP, который уменьшает вес файла в среднем на 39%, сохраняя, при этом, исходное качество.

Движки, которые обрабатывают JavaScript, были также перепроектированы для намного более быстрой обработки кода. Быстрые JavaScript-движки вроде V8 Google Chrome — это теперь базовая составляющая любого современного браузера и это значит, что следующее поколение отличных и полезных веб-приложений на основе JavaScript больше не будут, из-за огромного количества кода, камнем преткновения для браузеров.

Другой метод, который используется в современных браузерах вроде Chrome для более быстрого вызова и загрузки страниц, называется DNS pre-resolution (пред-выборка DNS). Процесс преобразования веб-адреса в IP-адрес через поиск DNS и наоборот часто называют «разрешение» или «выборка» (resolving — в оригинале). С использованием пред-выборки DNS, Chrome одновременно будет искать все ссылки на веб-странице и в фоновом режиме ускоренно переводить их веб-адреса в IP. Поэтому, когда вы нажмете на одну из ссылок, размешенных на странице, то браузер уже готов тут же отправить вас на нужную и заранее загруженную страницу. Со временем Chrome также запоминает информацию из прошлых визитов и когда вы в следующий раз посетите уже знакомые страницы, браузер автоматически преобразовывает все соответствующие ссылки и элементы на веб-странице в IP-адреса.

Когда-нибудь браузеры смогут еще до загрузки страницы предварительно формировать IP-адреса не только для различных ссылок на странице, но и для таких элементов как видео или изображения. Предварительная выборка поможет сделать Веб значительно быстрее.

Мы надеемся, что уже скоро загрузить новую страницу в браузере можно будет также быстро, как перевернуть страницу в книжке.

Куда дальше