Портрет 4X_Pro
Был в Сети 5 дек. 2025 г., 19:55
4X_Pro
Идеалист Интернета
  • Программист
  • Блоггер
  • Фотограф
Кратко о себе: Web-разработчик. Пишу на PHP, Python, JavaScript. Знаю Ruby и Go, со студенческих времён более-менее помню C и asm. Специализируюсь на ускорении загрузки сайтов и разработке ботов для Telegram. Linuxоид (использую Debian+Cinnamon). Сторонник IndieWeb, slow lifer.

Социальные сети


Новости сайта в Telegram

t.me/4x_pro

Компьютерное

Как перенести контакты с старого телефона на смартфон

4X_Pro
Недавно потребовалось перенести все контакты с обычного кнопочного мобильника (Philips Xenium) на смартфон с Android. Сначала казалось, что задача предельно простая: и в том, и в другом устройстве есть Bluetooth, и можно переслать по нему. Вскоре выяснилось, что возможности отправить адресную книгу целиком в Xenium нет, можно только слать контакты поштучно. Контактов было около 500, поэтому такой вариант не подходил. Однако из настроек Xenium выяснилось, что к контактам можно обращаться по Bluetooth извне. Возникла мысль поискать приложение для Android, которое сможет подключиться и забрать необходимую информацию.
Читать далее…

Как вставить элемент после тега script из самого скрипта

4X_Pro

Недавно столкнулся с такой задачей: требовалось в Javascript сформировать определенный HTML-код и вставить его сразу после тега script, из которого этот код вызывается. Возник вопрос: а как вообще узнать, какой скрипт сейчас выполняется?
Сделать это можно несколькими способами.

  • воспользоваться свойством document.currentScript, которое содержит ссылку на тег. Но оно не работает в старых броузерах, в частности во всех версиях MSIE (но работает в Edge). Кроме того, не следует обращаться к этому свойству из callbacks, это может приводить к некорректным результатам.
  • прописать id для тега и обращаться по нему: document.getElementById('идентификатор'). Это самый универсальный вариант, но с ним могут быть сложности, если скрипт подключается через механизмы, предусмотренные в CMS (там обычно не предусмотрено возможности указать id или иные атрибуты)
  • если точно известен URL скрипта и он не будет менятся, то можно воспользоваться document.querySelector('script[src="путь"]'). Полезно для различных встраиваемых сервисов (типа онлайн-помощников), которые берут скрипт с одного и того же URL.
  • наконец, самый надежный в плане обратной совместимости вариант — смотреть последний тег script:

    var s =  document.getElementsByTagName("script"); var attr = s[s.length-1].getAttribute("attr1");


    Однако работает он только в том случае, если скрипт подключается без async или defer.
Читать далее…

Как писать тег description для статей на информационных сайтах

4X_Pro

На SEO-форумах часто ругают Яндекс за то, что он игнорирует meta-тег description и вместо него выводит в сниппете произвольный кусок текста из страницы. Однако зачастую это результат того, что описание страницы составлено неправильно. Многие ошибочно воспринимают desciption как подзаголовок, своего рода дополнение, уточняющее тег TITLE, и пишут его в таком же стиле, составляя, в основном из существительных и прилагательных.
Каким же должно быть хорошее описание? Оно содержит одно или два полноценных предложения, в которых обязательно должны быть глаголы. В идеальном случае в них сосредоточена суть статьи, некий итог, который пользователь вынесет для себя после ее прочтения. Кроме того, следует помнить об ограничениях на длину: она не должна быть больше 160 символов. Кроме того, слишком короткие description (порядка 70—75 символов) также могут быть проигнорированы поисковыми системами.
Читать далее…

Оптимизация сайта для печати

4X_Pro

Очень часто при разработке сайта забывают о его оптимизации для печати. В чем же она заключается? По сути, в ней две составляющих: сделать так, чтобы лист использовался рационально, и убрать все то, что на бумаге бесполезно:

  • навигационное меню
  • формы для поиска по сайту и комментариев
  • рекламные блоки, виджеты соцсетей и кнопки «поделиться»
  • различные всплывающие и накладывающиеся поверх основного контента элементы (например, на этом сайте это ссылка «Задать вопрос» справа)
  • облако тегов
  • «подвал» сайта
Но не переусердствуйте! Обязательно оставьте видимыми «хлебные крошки», название и логотип сайта, а также контактные телефоны и Email, если они есть на сайте.
Кроме того, следите, чтобы при печати использовалась вся ширина листа, то есть не было бы жестко заданной ширины в пикселях для сайта в целом или для основного блока с контентом.
Как это сделать технически? Некоторые CMS позволяют создавать отдельные страницы для печати. Но это плохое решение: с точки зрения поисковых систем получаются дубли страниц, причем иногда версия для печати индексируется лучше, чем основная, и пользователи из поисковых систем, попадая на нее, не могут понять, как перейти на основной сайт. Поэтому лучше использовать средства CSS — media-запрос print, переопределив с его помощью CSS-свойства элементов на основной странице.
Читать далее…

ИКС от Яндекса: анализ моих сайтов

4X_Pro

.sites_table td { border: #ccc 1px solid; text-align: center } .sites_table { border-collapse: collapse }
Возможно, еще не всем известно, что на этой неделе Яндекс окончательно отменил ТИц и вместо него ввел новый показатель — индекс качества сайта (ИКС), который учитывает не только ссылочную массу, но и еще ряд факторов. Я собрал информацию по своим сайтам и получил следующие данные:
Читать далее…

Делаем Интернет снова быстрым или JavaScript по белому списку

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

Но увы, каждый раз лезть в настройки Opera и явно включать JavaScript для каждого сайта штатными средствами Opera очень неудобно. Стал задумываться об установке стороннего дополнения. Хотел было использовать NoScript, которым когда-то пользовался под Firefox, но под Opera его нет. Есть одноименное расширение от других разработчиков, но с ужасным интерфейсом и весьма неудобное.
Читать далее…

Время выполнения кода в PHP и Python

4X_Pro
Иногда при написании скриптов требуется узнать, сколько времени скрипт выполняется. Для этого есть несколько способов. Во-первых, можно воспользоваться стандартной для Unix-систем утилитой time:

Она выдаст что-то вроде

Здесь нас интересует первое значение: real. Оно показывает, сколько реального времени заняло выполнение скрипта. User и sys показывают потраченное процессорное время в режиме пользователя и режиме ядра, которое, даже суммарно, может быть меньше реального из-за простоя и ожидания.

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

Поэтому иногда бывает целесообразнее использовать средства самого языка программирования. В PHP для этого используется функция microtime:

В Python все аналогично, только необходимо подключить модуль time:

В JavaScript это выглядит чуть иначе — необходимо использовать объекты Date:
Читать далее…

Асинхронная загрузка CSS

4X_Pro
В Интернете есть примеры асинхронной загрузки CSS через setTimeout или манипуляции с media, но есть более красивое и современное решение — через rel=preload. Выглядит оно так:

Однако следует помнить, что если вы асинхронно загружаете основной CSS без выноса его критической части в тег style непосредственно в HTML, то получается довольно неприятный эффект — сначала страница отображается без стилей вообще, потом тут же перерисовывается заново. Поэтому такую асинхронную загрузку лучше применять только к вспомогательным CSS.
Читать далее…

CondiLoader — условная асинхронная загрузка скриптов и CSS

4X_Pro

Я уже не раз писал в этом блоге о приемах для ускорения отображения сайтов. Это и отложенная асинхронная загрузка, и условная загрузка по имени класса, и запуск inline JavaScript-кода после загрузки внешнего файла по событию.
Теперь же я сделал библиотеку-загрузчик, которая упрощает и автоматизирует их применение, а также позволяет собрать список всех используемых на сайте библиотек в одном месте. Называется она CondiLoader, скачать ее можно на GitHub или же установить через npm:

npm install condiloader


Работает CondiLoader следующим образом: вы передаете скрипту список объектов для загрузки, он дожидается события DOMContentLoaded. После этого для каждого объекта проверяет, необходимо ли загружать его для данной страницы. Если да, приступает к загрузке, после чего вызывает функцию инициализации, либо пользовательское событие с указанным именем. Все объекты загружаются параллельно, и ошибка при загрузке одного из них на остальные не влияет.
Читать далее…

Почему могут пропадать сессии в PHP при большой нагрузке

4X_Pro
Недавно столкнулся с вопросом, почему пропадают PHP-сессии при высокой нагрузке. Как известно, что по умолчанию сессии PHP хранятся в обычных текстовых файлах. В Debian/Ubuntu эти файлы располагаются в /var/lib/php/sessions/, в других дистрибутивах путь может отличаться. Сами файлы по размеру невелики, но если сессия открывается при каждом обращении к сайту, то когда на сайт заходит поисковый робот, таких файлов может создаваться весьма большое количество. Как этого избежать, я описывал в одном из предыдущих сообщений.
Читать далее…

Страницы: