Я думаю ни для кого не секрет, что скорость загрузки страницы влияет на множество факторов. Если кто-то не в курсе, то вкратце скажу следующее, что скорость загрузки влияет не только на то, дождется ли посетитель, когда загрузится Ваш сайт, но и на SEO оптимизацию. Ведь на сегодняшний день уже многие поисковые системы при ранжировании сайтов, начали учитывать скорость загрузки страницы. Поэтому чем быстрее будет грузиться Ваш сайт, тем больше посетителей Вы можете получить с поисковых систем, а, следовательно, и больше денег на этом заработать.
Поэтому в этой статья я решил собрать топ-10 советов о том, как же можно увеличить скорость загрузки веб-странички и сайта в целом. Статья не претендует на гениальность и рассчитана на новичков.
Топ-10 советов о том, как увеличить скорость загрузки страницы
Для тех кто только начал постигать азы клиентской оптимизации будет самое оно. Для тех кто хочет погрузиться глубже в тему, следует почитать книгу "Разгони свой сайт".
Недавно понадобилось срочно осваивать тему высокой производительности и построения высоконагруженных решений. Очень помгла книга: MySQL Оптимизация производительности. Книга написано хорошо и понятно, дается много практических примеров. Тем, кто хочет освоить тему высокой производительности баз данных и построения высоконагруженных решений - рекомендую.
Прочитав эту книгу вы сможете понять как оптимизировать базу данных, узнаете:
что такое горизонтальное масштабирование
что такое верчиткальное масштабирование
что такое репликация и как она происходит
архитектуру балансирвания нагрузки для сайтов с высокой посещаемостью
У каждой задачи есть несколько вариантов решения. И иногда в угоду скорости приходится выбирать не самый красивый, зато работающий и выполняющий поставленные перед ним цели. Итак, в один не очень прекрасный день возникла необходимость реализовать следующую функцию: у каждой (почти) страницы сайта должны быть автоматически сгенерированные копии в форматах DOC и PDF. С сохранением всех таблиц и картинок внутри контента. И если с PDF всё относительно просто (tcpdf наш друг и брат), то с DOC'ом возникла морока. Под катом — пример решения данной задачи.В голову приходили последовательно такие варианты решения:
Установить на сервер OpenOffice (сервер на FreeBSD) и разобраться с преобразованием. Красивое решение, но время поджимало.
Сгенерировать вместо DOC'а файлик в формате RTF, благо формат открытый и библиотек для работы с ним много. Минус – готового преобразователя HTML->RTF (с, напомню, сохранением картинок и таблиц) я не нашел, а писать свою – для этого нужен определённый запас времени
Не очень честный — просто “в лоб” сохранить HTML страницу с расширением DOC – Word 2003 и выше откроет без проблем, проверено. Плюс – отличнейшая скорость преобразования и сохранение всей верстки. Минус – картинки таким образом не сохранить (да и честность метода несколько хромает).
Вот собственно из третьего варианта и родилось окончательное решение: создавать документ формата MHT, интегрировать в него картинки и сохранить с расширением DOC. Для генерации использовалась простенькая библиотека, взятая отсюда .Код не претендует на красоту и универсальность, более того, в нем есть проблемы, не актуальные для того сайта, но главное – он работает, и его достаточно, чтобы разобраться в теме.
Не очень честная генерация DOC файлов на PHP
Появилась бы эта статья прошлым летом, когда мне надо было автоматически генерировать файлы doc по шаблону, цены бы ей для меня не было!
Иногда не совсем понятно какие функции HTML5 уже поддерживаются всеми современными браузерами и их можно использовать безо всяких дополнительных интрументов, а какие надо использовать аккуратно, попутно встраивая в сайт напильник для браузера, чтобы модная фишка могла нормально отображаться в нем. Нашел недавно сайт https://html5please.us/, в котором просто и понятно расписано что и как. Есть функция, для нее отображается можно ли ее использовать просто так, или надо обязательно использовать с ней дополнительный интрумент. Удобно.
Идея следующая. Да, у нас много JavaScript, да он как-то разбит, да нам надо подключать часть его на страницах по каким-то правилам. Пусть результирующий HTML, который получился в результате отработки всей нашей логики, и будет конфигом того, что нужно подключить.
Поясню. У нас есть тег div, включающий какой-нибудь законченный блок — допустим, это будет список папок, т. е. в этом диве лежит список папок. Первый шаг, мы помечаем с помощью класса — этот див является компонентом. Это означает, что js-движок будет искать его по этой отметке. Вторая строчка — onclick, там указан return, и какой-то хеш. В этом хеше находится описание того, что это за компонент.
В результате нам надо найти компонент в DOM-дереве. Определить, что это за компонент (в моем случае информация о типе находится в onclick). Подключить js-файлы, чтобы все это заработало.
Первая задача решается, по крайней мере в современных браузерах, очень легко. CSS-селекторы работают много где нативно, а там, где не нативно, у вас есть в распоряжении соответствующие библиотеки.
Теперь самая интересная часть, то что записано в onclick. Там можно зашить любую информацию, которая вам нужна для инициализации. В моем случае это тип компонента, по содержимому хеша я понимаю, что это компонент по работе с папками. Достать его очень легко.
Как не утонуть в мегабайтах javascript кода?
Действительно очень удобное и мастштабируемое решение. Как будет шанс попробую его в своих проектах.
Недавно понадобилось срочно осваивать тему высокой производительности и построения высоконагруженных решений. Очень помгла книга: MySQL Оптимизация производительности. Книга написано хорошо и понятно, дается много практических примеров. Тем, кто хочет освоить тему высокой производительности баз данных и построения высоконагруженных решений - рекомендую.