Ошибка рендеринга страницы при печати что делать

Локальный принтер застрял на «Рендеринг завершен»

Я не могу печатать документы на своем принтере HP. Тем не менее, я могу печатать тестовые страницы.

Что я пробовал:

Я попытался удалить и переустановить принтер из системных настроек, но я могу печатать только один раз (первое задание). Затем все следующие задачи застрянут в состоянии «Отрисовка завершена».

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

Более того, я вошел в систему CUPS ( 1.6.2) из http://localhost:631

Оттуда я удалил принтер, перезапустил его и переустановил безуспешно.

Технические характеристики системы:

Система: Ubuntu GNOME 13.04

Процессор: двухъядерный процессор AMD Athlon(tm) 64 X2 4200+ × 2

Графика: Галлий 0,4 на NVA3

Принтер: HP Deskjet 2050 j510 Series

У меня не было проблем с моей предыдущей ОС, которая была Pinguy OS 11.04 (дистрибутив на основе Ubuntu 11.04), и я впервые использую свой принтер в этой ОС.

Скриншоты:

Мой принтер застрял в состоянии «Рендеринг завершен».

Из веб-интерфейса CUPS; Вы можете видеть, что «Rendering Completed» застрял в состоянии процесса печати.

Источник

CUPS (Русский)/Troubleshooting (Русский)

В этой статье рассматриваются все неспецифические (то есть не связанные с каким-либо одним принтером) проблемы CUPS и драйверов принтеров (но не проблемы, связанные с совместным использованием принтеров), включая методы определения точной природы проблемы и решения выявленной проблемы.

Contents

Введение

Наилучший способ борьбы с неисправностями — это выставить ‘LogLevel’ в файле /etc/cups/cupsd.conf на:

А потом посмотреть вывод из файла /var/log/cups/error_log например так:

Символы слева от вывода означают следующее:

• D=Debug(отладка)
• E=Error(ошибка)
• I=Information(информация)
• И так далее

Следующие файлы также могут быть полезны:

• /var/log/cups/page_log — каждый раз при успешной печати, пишет новую запись
• /var/log/cups/access_log — записывает всю активность на cupsd http1.1 сервере

Также, если вы хотите решить свои проблемы, важно понимать, как вообще работает CUPS. Вот краткая информация об этом:

1. Когда вы жмёте ‘печать’ приложение отправляет .ps-файл (PostScript, язык-скрипт, который описывает, как выглядит страница) в систему CUPS (так происходит в большинстве программ).
2. CUPS смотрит на PPD-файл (файл описания принтера) и находит, фильтры которые ему нужно использовать для преобразования .ps-файла в файл, который понимает ваш принтер (например, PJL,PCL). Обычно для этого ему требуется ghostscript.
3. GhostScript принимает ввод и решает, какие фильтры ему использовать, потом применяет их и преобразовывает .ps-файл в формат, который понимает принтер.
4. Затем файл передается бэкенду. Например, если у вас принтер подключен к usb порту, то используется usb бэкенд

Распечатайте документ и посмотрите error_log , чтобы получить более подробное и правильное представление об процессе печати.

Проблемы, возникающие в результате обновлений

Проблемы возникшие после обновления CUPS и сопутствующего ему набора программ

CUPS останавливается

Существует вероятность, что для правильной работы в обновленной версии понадобится новый файл конфигурации. Например, получение сообщения «404 — page not found» при попытке входа в панель управления CUPS через localhost:631.

Для того, чтобы воспользоваться новым конфигом, скопируйте /etc/cups/cupsd.conf.default в /etc/cups/cupsd.conf (при необходимости сделайте резервную копию старого конфига) и, чтобы новые настройки вступили в силу, перезапустите CUPS.

Для всех заданий — «остановлено»

The factual accuracy of this article or section is disputed.

Если для всех отправленных на печать заданий установился статус «остановлено» («stopped»), — удалите принтер и установите его заново. Для этого войдите в веб-интерфейс CUPS, перейдите Принтеры > Удалить Принтер.

Для проверки настроек принтера перейдите во вкладку Принтеры, затем скопируйте отображаемую информацию. Далее нажмите на Администрирование. В выпадающем списке кликните Изменить принтер, перейдите к следующей странице(ам), и так далее.

Для всех заданий — «Принтер не отвечает»

Для сетевых принтеров, поскольку CUPS подключается через URI, необходимо убедиться, что в DNS настроен доступ к принтерам по IP. Например, если принтер подключен следующим образом:

то имя хоста ‘BRN_020554’ должно соответствовать IP принтера, управляемого сервером CUPS. Если используется Avahi, убедитесь, что разрешение имени хоста Avahi работает.

Альтернативно, замените имя хоста, используемое в URI, IP-адресом принтера.

Версия PPD не совместима с gutenprint

И перезагрузите CUPS (будет выведено соответствующее сообщение после установки gutenprint).

Проблемы с сетью

Не удается найти принтер

Даже если CUPS обнаруживает сетевые принтеры, вы все равно можете получить ошибку «Не удается найти принтер» («Unable to locate printer») при попытке распечатать что-либо. Чтобы решить эту проблему, включите .разрешение локального имени хоста Avahi. Для получения дополнительной информации смотрите CUPS (Русский)#Сеть.

Эта проблема может возникать и при использовании файрвола (межсетевой экран, брандмауэр). Возможно, вам придется отключить его или установить корректные правила. Если вы используете system-config-printer для обнаружения сетевых принтеров, тогда он сделает все это автоматически.

Старый сервер CUPS

Начиная с версии CUPS 1.6, клиент по умолчанию использует IPP 2.0. Если сервер использует CUPS version=1.1 , описанной в Таблице 2. Опции URI IPP.

Общий принтер работает локально, но удаленный компьютер не печатает

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

Не удается найти файл PPD

Убедитесь, что Avahi настроен правильно. В частности, проверьте, что nss-mdns установлен и настроен в /etc/nsswitch.conf .

USB-принтеры

Конфликт с SANE

Если у вас также запущен SANE, возможно, что он конфликтует с CUPS. Чтобы исправить это, создайте правило Udev, обозначающее устройство как совпадающее с libsane:

Конфликт с usblp

Доступ к USB-принтерам можно получить двумя способами: модулем ядра usblp и libusb. Первый — это классический способ. Это просто: данные отправляются на принтер, записывая их в файл устройства в виде простого последовательного потока данных. Чтение одного и того же файла устройства позволяет использовать двунаправленный доступ, по крайней мере, для таких вещей, как считывание уровней чернил, статуса или информации о возможностях принтера (PJL). Он работает очень хорошо для простых принтеров, но для многофункциональных устройств (принтер/сканер) он не подходит, и производители, такие как HP, поставляют свои собственные бэкенды. Источник: здесь.

Если у вас возникли проблемы с работой USB-принтера, вы можете попробовать запрет загрузки для модуля ядра usblp :

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

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

Если вы используете usblp , вывод должен указывать на то, что принтер был обнаружен следующим образом:

Если вы запретили загрузку usblp , вы увидите что-то вроде:

USB autosuspend

Ядро Linux автоматически приостанавливает USB-устройства, когда есть поддержка драйверов и устройства не используются. Это может сэкономить электроэнергию, но некоторые USB-принтеры считают, что они не подключены, когда ядро приостанавливает USB-порт, предотвращая печать. Это можно устранить, отключив autosuspend для конкретного устройства, для получения дополнительной информации смотрите Power management#USB autosuspend.

Плохие разрешения

Проверьте разрешения USB-порта принтера. Получите номер шины (BUSID) и устройства (DEVID) от lsusb :

Проверьте владельца, просмотрев devfs:

Демон cups запускается от пользователя «cups» и относится к группе «lp», поэтому либо этому пользователю, либо группе требуется доступ на чтение и запись в USB-устройство. Если вы считаете, что разрешения выглядят неправильно, вы можете временно изменить группу и разрешение:

Затем проверьте, может ли cups теперь видеть устройство USB правильно.

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

После редактирования перезагрузите правила udev этой командой:

Каждая система может отличаться, поэтому обратитесь к вики-странице udev (Русский)#Список атрибутов устройства.

Проблемы с HP

CUPS: «/usr/lib/cups/backend/hp failed»

The factual accuracy of this article or section is disputed.

Убедитесь, что dbus установлен и запущен. Если ошибка повторяется, попробуйте запустить avahi-daemon.

Попробуйте добавить принтер в качестве сетевого принтера, используя протокол http:// .

CUPS: «Печать завершена», но принтер не печатает.

Это происходит на принтерах HP, когда вы выбираете (старый) драйвер hpijs (например, для Deskjet D1600 series). Вместо этого используйте драйвер hpcups.

Некоторые принтеры HP требуют, чтобы их прошивка загружалась с компьютера при каждом включении принтера. Вы можете столкнуться с этой проблемой, если есть проблема с udev (или аналогом), и правило загрузки прошивки никогда не запускается. В качестве обходного пути вы можете вручную загрузить прошивку на принтер. Убедитесь, что принтер подключен и включен, затем выполните

CUPS: ‘»foomatic-rip» not available/stopped with status 3’

Если, во время использования принтера HP, задания появляются в очереди, но все завершаются со статусом ‘остановлен’ (‘stopped’), а в /var/log/cups/error_log возникает одно из следующих сообщений об ошибках:

CUPS: «Filter failed»

Ошибка «filter failed» может быть вызвана некоторым количеством причин. Журнал ошибок CUPS (по умолчанию /var/log/cups/error_log ) должен записывать, какой фильтр не удалось загрузить и почему.

Отсутствует ghostscript

Установите ghostscript ( /usr/lib/cups/filter/gstoraster нуждается в его запуске).

Отсутствует foomatic-db

Установите foomatic-db и foomatic-db-ppds . Это помогает в некоторых случаях.

Avahi не включен

Устаревший плагин

Эта ошибка может указывать на то, что плагин устарел (версия несовместима) и может произойти после обновления системы, возможно, появится сообщение Plugin error в журнале (логе). Если вы установили hplip-plugin AUR , вам нужно обновить пакет, иначе перезапустите hp-setup -i , чтобы установить последнюю версию плагина.

Устаревшая конфигурация принтера

Начиная с hplip-plugin AUR версии 3.17.11 hpijs больше не доступен. Если у вас есть принтеры, использующие hpijs, они не будут печатать. Необходимо перенастроить их и выбрать вместо этого новый драйвер hpcups.

Вы можете проверить, если это ваш случай, посмотрев в error_log cups`а:

CUPS: печатает только пустую страницу и страницу с сообщением об ошибке на HP LaserJet

This article or section is out of date.

Существует ошибка, которая приводит к сбою CUPS при печати изображений на HP LaserJet (в моем случае 3380). Ошибки были зафиксированы и исправлены в Ubuntu. Первая страница пуста, вторая страница содержит следующее сообщение об ошибке:

Чтобы устранить проблему, выполните следующую команду как суперпользователь (root):

HPLIP 3.13: Плагин установлен, но HP Device Manager жалуется на его отсутствие

Возможно, проблема связана с изменением прав доступа файла, которое было внесено в /var/lib/hp/hplip.state . Чтобы исправить проблему, достаточно простых команд chmod 644 /var/lib/hp/hplip.state и chmod 755 /var/lib/hp . Для получения дополнительной информации, пожалуйста, прочитайте эту ссылку.

hp-toolbox: «Unable to communicate with device»

Разрешение проблемы

The factual accuracy of this article or section is disputed.

Может потребоваться добавить пользователя в группы lp и sys .

Виртуальный CDROM у принтеров

Это также может быть вызвано принтерами, такими как P1102, которые предоставляют виртуальный привод CD-ROM для драйверов MS Windows. Появляется lp dev, а затем исчезает. В этом случае попробуйте пакеты usb-modeswitch и usb-modeswitch-data, что позволяет отключить «Smart Drive» (правила udev, включенные в указанные пакеты).

Сетевые принтеры

Это также может происходить с сетевыми принтерами, использующими динамические имена хостов, если avahi-daemon не запущен. Другая причина заключается в том, что hp-setup не удалось найти принтер, потому что IP-адрес принтера изменился из-за DHCP. Если это так, подумайте о добавлении резервирования DHCP для принтера в конфигурации сервера DHCP.

hp-setup просит указать PPD-файл для обнаруженного принтера

Кроме того, при выборе файла PPD в графическом режиме hp-setup поле не обновляется и сообщение об ошибке не отображается.

Или, если вы используете интерактивный (консольный) режим, можно столкнуться с чем-то похожим на это даже при введении правильного пути к файлу ppd:

Решение заключается в установке и запуске cups перед запуском hp-setup .

hp-setup: «Qt/PyQt 4 initialization failed»

Установите пакет python-pyqt4 AUR , который дополнительно требуется (optdepend) для hplip . Альтернативно вы можете запустить hp-setup с интерфейсом командной строки с помощью флага -i .

hp-setup: находит принтер автоматически, но сразу после этого сообщает «Unable to communicate with device» при печати тестовой страницы

Это, по крайней мере, происходит с hplip 3.13.5-2 у принтера HP Officejet 6500A через локальное сетевое соединение. Чтобы решить проблему, укажите IP-адрес принтера HP для hp-setup, чтобы обнаружить принтер.

hp-setup: «KeyError: ‘family-class’»

Если при добавлении принтера в пользовательском интерфейсе он не работает, или вы получили KeyError: ‘family-class’ от hp-setup , возможно потребуется обновить вручную /usr/share/hplip/data/models/models.dat .

Проверьте определен ли раздел family-class=Undefined для вашего принтера. Если нет, добавьте это:

Другие

Принтер «приостановлен — «Paused»» или «Остановлен» cо статусом «Рендеринг завершен»

Низкий уровень чернил

При низком уровне чернил некоторые принтеры зависают со статусом «Рендеринг завершен» («Rendering completed»), и, если это сетевой принтер, принтер может даже стать недоступным для CUPS, несмотря на то, что он правильно подключен к сети. Замена картриджа (картриджей) с низким уровнем чернил в этом случае вернет принтер в статус «Готов» («Ready») и, если он — сетевой принтер, то он станет снова доступным для CUPS.

Завершение печати из-за ошибок авторизации

Если удаленный принтер запрашивает аутентификацию, CUPS автоматически добавит директиву AuthInfoRequired для принтера в /etc/cups/printers.conf . Однако некоторые графические приложения (например, некоторые версии LibreOffice [1]) не имеют возможности запрашивать учетные данные, поэтому печать завершилась с ошибкой. Чтобы исправить это, укажите требуемое имя пользователя и пароль в URI. Для получения дополнительной информации смотрите [2], [3].

Unknown supported format: application/postscript

(Не найдена поддержка формата: application/postscript)

в /etc/cups/mime.convs и:

Ошибка задания для печати (Print-Job) client-error-document-format-not-supported

Попробуйте установить пакет foomatic и используйте драйвер foomatic.

Не удается получить список драйверов принтера

(Также применимо к ошибке «-1 не поддерживается!»)

Попробуйте удалить драйверы Foomatic или обратитесь к CUPS/Принтероспецифичные проблемы#HPLIP для обходного пути.

lp: Error — Scheduler Not Responding

Если вы получите эту ошибку, убедитесь, что CUPS запущен, переменная окружения CUPS_SERVER не установлена и /etc/cups/client.conf корректный.

Сообщение об ошибке: «Using invalid Host»

Попробуйте добавить ServerAlias * в /etc/cups/cupsd.conf .

Не удается отправить на печать из LibreOffice

Если вы можете распечатать тестовую страницу с веб-интерфейса CUPS, но не из LibreOffice, попробуйте установить пакет a2ps .

Вывод принтера сдвинут

По-видимому, это связано с неправильным размером страницы, установленным в CUPS.

Принтер не работает (приостановлен — «Paused») после ошибки

Когда во время печати возникает ошибка, принтер в CUPS может перестать отвечать на запросы. lpq сообщает, что принтер is not ready (не готов), его можно активировать с помощью cupsenable . В веб-интерфейсе CUPS принтер отображается как приостановлен — «Paused», его можно возобновить с помощью Восстановить печать.

Чтобы CUPS автоматически активировал принтер, измените политику ошибок с стандартной настройки Останавливать принтер (stop-printer) на Повторить задание (retry-this-job).

Samsung: URF ERROR — Incomplete Session by time out

Эта ошибка обычно возникает при печати файлов по сети через IPP на принтерах Samsung и решается с помощью пакета samsung-unified-driver AUR .

Brother: Принтер печатает несколько копий

Иногда принтер печатает несколько копий документа (например, MFC-9330CDW напечатал 10 копий). Решение заключается в обновлении прошивки принтера.

Обычный пользователь не может изменять настройки принтера или удалять определенные задания

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

Источник

Ресурсы блокировки рендеринга — это статические файлы, такие как файлы шрифтов, HTML, CSS и JavaScript, которые жизненно важны для процесса рендеринга веб-страницы. Когда браузер сталкивается с ресурсом блокировки рендеринга, он прекращает загрузку остальных ресурсов до тех пор, пока эти критические файлы не будут обработаны. Тем временем весь процесс рендеринга приостанавливается. С другой стороны, ресурсы, не блокирующие рендеринг, не откладывают рендеринг страницы. Браузер может безопасно загрузить их в фоновом режиме после отрисовки начальной страницы.

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

Зачем устранять ресурсы, блокирующие рендеринг?

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

Есть три способа уменьшить количество и влияние ресурсов, блокирующих рендеринг:

1. Сделайте их не блокирующими рендеринг ресурсами, отложив их загрузку
2. Уменьшите общее количество ресурсов, блокирующих рендеринг, используя такие методы, как объединение (это также означает меньше HTTP-запросов)
3. Уменьшите размер ресурса с помощью минификации, чтобы на странице было меньше байтов для загрузки

Типы ресурсов, блокирующих рендеринг

Как правило, браузер обрабатывает все, что находит в разделе <head> HTML-страницы, как блокировку рендеринга. Это включает в себя:

1. Таблицы стилей CSS
2. Файлы JavaScript добавленные в раздел <head>
3. Шрифты, добавленные либо из CDN, либо с локального сервера
4. Импорт HTML (хотя импорт HTML теперь устарел, вы все еще можете встретить его на старых страницах)

Изображения, медиафайлы и теги <script>, размещенные внизу раздела <body>, рассматриваются как ресурсы, не блокирующие рендеринг.

Теперь давайте рассмотрим пять стратегий для устранения или уменьшения количества и воздействия ресурсов, блокирующих рендеринг.

1. Не добавляйте CSS с правилом @import

Вы можете добавить CSS на страницу, используя:

1. Тег <link rel="stylesheet">, который нужно добавить в свой HTML — файл
2. Правило @import, которое вам нужно добавить в ваш CSS-файл

Несмотря на то, что правило @import сохраняет ваш HTML-файл более чистым и позволяет хранить все ваши CSS-зависимости в одном месте, это не лучший выбор с точки зрения производительности. Правило @import позволяет импортировать CSS из других таблиц стилей, но это приводит к тому, что браузер обрабатывает ваш CSS-файл медленнее, поскольку ему также приходится загружать импортированные файлы. Пока это не произойдет, процесс рендеринга будет заблокирован.

Если вы хотите добавить на свою страницу более одного файла CSS, вы можете либо использовать тег <link>, либо объединить файлы с помощью инструмента минификации и / или объединения.

Вам нужно добавить элемент <link> в раздел <head> HTML-страницы следующим образом:

<head>
  <link href="style.css" rel="stylesheet">
</head>

2. Используйте атрибут media для условного CSS

По умолчанию браузер обрабатывает все файлы CSS как ресурсы, блокирующие рендеринг. Однако, если вы добавите атрибут media к тегу <link>, вы можете указать браузеру наличие условного файла CSS.

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

<link href="print.css" rel="stylesheet" media="print">
<link href="large.css" rel="stylesheet" media="screen and (min-width: 1500px)">
<link href="mobile.css" rel="stylesheet" media="screen and (max-width: 600px)">

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

Например, таблица стилей mobile.css в приведенном выше примере будет блокировать рендеринг на мобильных устройствах с максимальной шириной области просмотра 600px и не блокировать рендеринг в окнах просмотра больше 600px.

Если у вас есть файл CSS с одним или несколькими медиа-запросами, вы можете извлечь все правила @media и сохранить их в виде отдельных файлов с помощью этого плагина PostCSS. Этот метод оптимизации производительности также называется разделением кода. Хотя разделение кода обычно упоминается в связи с JavaScript, вы также можете разделить большие файлы CSS и загружать каждый файл только тогда, когда это необходимо, чтобы сократить критический путь рендеринга и уменьшить время загрузки начальной страницы.

3. Используйте атрибуты defer и async для устранения визуализации блокировки JavaScript

Файлы JavaScript, добавленные в раздел документа <head>, по умолчанию обрабатываются как ресурсы, блокирующие рендеринг.

Вы можете удалить их из критического пути рендеринга, разместив теги <script> прямо перед закрывающим тегом </body> вместо раздела <head>. В этом случае они начнут загружаться только после того, как будет загружен весь HTML. Однако, поскольку загрузка этих сценариев начинается позже, загружаемые ими элементы, такие как реклама, анимация или динамические функции, могут загружаться позже, чем остальная часть внешнего интерфейса, особенно если это более длинный сценарий. Это может привести к заметным задержкам и отставанию пользовательского интерфейса при более медленных соединениях, что плохо для пользователя.

В атрибутах defer и async тега <script> предлагают решение этой проблемы. Оба являются логическими атрибутами, что означает, что если вы их добавите, они будут срабатывать без какой-либо дополнительной настройки. Они также добавляют скрипты в раздел <head> HTML-документа без блокировки рендеринга, но другим способом — отложенные скрипты соблюдают порядок документа, в то время как асинхронные скрипты не зависят от DOM.

Атрибут defer указывает браузеру загружать скрипт в фоновом режиме, чтобы он не блокировал рендеринг страницы. Отложенный сценарий выполняется после того, как DOM будет готов, но до того, как сработает событие DOMContentLoaded.

<script src="script01.js" defer></script>
<script src="script02.js" defer></script>

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

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

Например, в приведенном ниже примере мы не можем быть уверены, какой сценарий запустится первым; это зависит исключительно от того, что загружается быстрее (обычно меньшее). Помните, что асинхронные сценарии независимы как от документа, так и друг от друга, поэтому порядок документов никоим образом не повлияет на них.

<script src="script03.js" async></script>
<script src="script04.js" async></script>

Атрибут defer рекомендуется использовать для сценариев, которым требуется DOM, но вы хотите начать их загрузку до загрузки документа, не превращая их в блокирующий рендер ресурс. Вы также должны использовать defer, а не async, если порядок документов важен — например, когда последовательные сценарии зависят друг от друга.

Атрибут async рекомендуется использовать для независимых сторонних скриптов, таких как рекламные объявления, трекеры и аналитические скрипты. Например, Google Analytics рекомендует добавить атрибут async для поддержки асинхронной загрузки в современных браузерах.

4. Минимизируйте и объедините CSS и JavaScript.

Помимо удаления несущественных CSS и JavaScript из критического пути рендеринга, вы также можете минимизировать и объединить ресурсы, блокирующие рендеринг, и ресурсы, не блокирующие рендеринг.

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

Существует множество инструментов, которые помогут вам выполнить минификацию и объединение в соответствии с передовыми практиками, включая Minify, CSS Minifier, Minify Code и PostCSS. Инструменты сборки, такие как webpack, Parcel и Rollup, имеют встроенные функции минификации, объединения и разделения кода, которые позволяют быстро уменьшить количество ресурсов, блокирующих рендеринг.

5. Загрузите пользовательские шрифты локально.

Поскольку пользовательские шрифты вызываются из раздела <head> документа, они также блокируют отображение ресурсов. Например:

<link href="https://fonts.googleapis.com/css2?family=Lato&display=swap" rel="stylesheet"> 

Вы можете уменьшить влияние пользовательских шрифтов на начальную отрисовку страницы, добавляя их локально, а не извлекая их из сети доставки контента, такой как Google CDN. Поставщики шрифтов, как правило, добавляют несколько правил @font-face, многие из которых вам не понадобятся.

Например, Google Fonts добавляет правила @font-face для всех наборов символов, с которыми идет гарнитура, таких как латиница, кириллица, китайский, вьетнамский и другие. Скажем, например, что онлайн-файл CSS, который вы добавляете с тегом <link>, включает правила @font-face для семи различных наборов символов, но вы хотите использовать только один (например, латинский). Однако шрифты Google не загружают файлы шрифтов для всех наборов символов; они просто добавляют много избыточных правил @font-face в файл CSS.

Если вы добавляете шрифты локально, вы также можете минимизировать свой CSS, связанный со шрифтами, и связать его с остальной частью вашего CSS. Вы можете использовать Google Web Fonts Helper для быстрого создания локальных правил @font-face для Google Fonts. Например, вот что вам нужно добавить, чтобы включить начертание шрифта Lato Regular:

/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Lato Regular'), local('Lato-Regular'),
       url('../fonts/lato-v16-latin-regular.woff2') format('woff2'),
       url('../fonts/lato-v16-latin-regular.woff') format('woff');
}

Обратите внимание, что Google Web Fonts Helper не добавляет правила font-display: swap; я сам добавил это в указанное выше объявление. Это дескриптор правила @font-face, позволяющего указать, как браузер должен отображать начертание шрифта на странице.

Используя font-display со значением swap, вы даете команду браузеру немедленно начать использовать системный шрифт и заменить его пользовательским шрифтом после загрузки (это правило также добавляется, когда вы извлекаете шрифт из CDN Google). Это позволяет избежать невидимого текста на странице, пока пользовательский шрифт все еще загружается.

Когда вы загружаете шрифты локально, убедитесь, что вы обслуживаете сжатые форматы шрифтов для современных браузеров, таких как WOFF и WOFF2. Помните, что более легкие файлы также уменьшают влияние ресурсов, блокирующих рендеринг. Помимо создания правил @font-face, Google Web Fonts Helper также позволяет загружать заархивированный файл, содержащий все нужные вам форматы шрифтов.

Почему не следует загружать пользовательские шрифты асинхронно

В некоторых статьях о ресурсах блокировки рендеринга рекомендуется использовать загрузчик веб-шрифтов TypeKit для асинхронной загрузки пользовательских шрифтов. Когда-то это был достойный инструмент, но он не обновлялся с 2017 года, и у него много нерешенных проблем. Я бы не рекомендовал его использовать.

Хотя асинхронная загрузка шрифтов сокращает критический путь рендеринга, вы всегда должны делать это осторожно. Если шрифты загружаются позже, чем содержимое страницы, на странице может возникнуть общая проблема UX, называемая миганием невидимого текста (FOIT).

Существуют различные способы, чтобы справиться с FOIT, например, использование сторонних библиотек или вышеупомянутое правило font-display: swap (см. поддержка браузера для font-display, плюс, обратите внимание, что использовать его с правилом swap просто превращает FOIT в FOUT — вспышка неокрашенного текста — но это не полностью устраняет проблему). Тем не менее, вы захотите потратить время на обдумывание того, действительно ли стоит идти по асинхронному маршруту с точки зрения производительности. Подумайте о весе дополнительных скриптов, потенциальных проблемах, пользователях с отключенным JavaScript (вам все равно нужно добавить статический элемент <link> в теги <noscript> для их поддержки) и т. д.

Резюме

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

1. Не используйте импорт CSS
2. Загрузить условный CSS с атрибутами media
3. Используйте атрибуты defer и async для устранения рендер блокировки JavaScript
4. Разделение, объединение и минимизация файлов CSS и JavaScript
5. Локальная загрузка пользовательских шрифтов

Чтобы найти файлы блокировки рендеринга, вы можете использовать инструменты анализа производительности, такие как Lighthouse, web.dev (тот же инструмент, что и Lighthouse, только интегрированный в веб-приложение), GTmetrix и другие. Эти инструменты не только помогают найти ресурсы, блокирующие рендеринг, но и предлагают практические советы, которые помогут повысить производительность вашего сайта.

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

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

Локальный принтер застрял на «Рендеринг завершен»

Я не могу печатать документы на своем принтере HP. Тем не менее, я могу печатать тестовые страницы.

Что я пробовал:

Я попытался удалить и переустановить принтер из системных настроек, но я могу печатать только один раз (первое задание). Затем все следующие задачи застрянут в состоянии «Отрисовка завершена».

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

Более того, я вошел в систему CUPS ( 1.6.2) из http://localhost:631

Оттуда я удалил принтер, перезапустил его и переустановил безуспешно.

Технические характеристики системы:

Система: Ubuntu GNOME 13.04

Процессор: двухъядерный процессор AMD Athlon(tm) 64 X2 4200+ × 2

Графика: Галлий 0,4 на NVA3

Принтер: HP Deskjet 2050 j510 Series

У меня не было проблем с моей предыдущей ОС, которая была Pinguy OS 11.04 (дистрибутив на основе Ubuntu 11.04), и я впервые использую свой принтер в этой ОС.

Скриншоты:

Мой принтер застрял в состоянии «Рендеринг завершен».

Из веб-интерфейса CUPS; Вы можете видеть, что «Rendering Completed» застрял в состоянии процесса печати.

Источник

CUPS (Русский)/Troubleshooting (Русский)

В этой статье рассматриваются все неспецифические (то есть не связанные с каким-либо одним принтером) проблемы CUPS и драйверов принтеров (но не проблемы, связанные с совместным использованием принтеров), включая методы определения точной природы проблемы и решения выявленной проблемы.

Contents

Введение

Наилучший способ борьбы с неисправностями — это выставить ‘LogLevel’ в файле /etc/cups/cupsd.conf на:

А потом посмотреть вывод из файла /var/log/cups/error_log например так:

Символы слева от вывода означают следующее:

• D=Debug(отладка)
• E=Error(ошибка)
• I=Information(информация)
• И так далее

Следующие файлы также могут быть полезны:

• /var/log/cups/page_log — каждый раз при успешной печати, пишет новую запись
• /var/log/cups/access_log — записывает всю активность на cupsd http1.1 сервере

Также, если вы хотите решить свои проблемы, важно понимать, как вообще работает CUPS. Вот краткая информация об этом:

1. Когда вы жмёте ‘печать’ приложение отправляет .ps-файл (PostScript, язык-скрипт, который описывает, как выглядит страница) в систему CUPS (так происходит в большинстве программ).
2. CUPS смотрит на PPD-файл (файл описания принтера) и находит, фильтры которые ему нужно использовать для преобразования .ps-файла в файл, который понимает ваш принтер (например, PJL,PCL). Обычно для этого ему требуется ghostscript.
3. GhostScript принимает ввод и решает, какие фильтры ему использовать, потом применяет их и преобразовывает .ps-файл в формат, который понимает принтер.
4. Затем файл передается бэкенду. Например, если у вас принтер подключен к usb порту, то используется usb бэкенд

Распечатайте документ и посмотрите error_log , чтобы получить более подробное и правильное представление об процессе печати.

Проблемы, возникающие в результате обновлений

Проблемы возникшие после обновления CUPS и сопутствующего ему набора программ

CUPS останавливается

Существует вероятность, что для правильной работы в обновленной версии понадобится новый файл конфигурации. Например, получение сообщения «404 — page not found» при попытке входа в панель управления CUPS через localhost:631.

Для того, чтобы воспользоваться новым конфигом, скопируйте /etc/cups/cupsd.conf.default в /etc/cups/cupsd.conf (при необходимости сделайте резервную копию старого конфига) и, чтобы новые настройки вступили в силу, перезапустите CUPS.

Для всех заданий — «остановлено»

The factual accuracy of this article or section is disputed.

Если для всех отправленных на печать заданий установился статус «остановлено» («stopped»), — удалите принтер и установите его заново. Для этого войдите в веб-интерфейс CUPS, перейдите Принтеры > Удалить Принтер.

Для проверки настроек принтера перейдите во вкладку Принтеры, затем скопируйте отображаемую информацию. Далее нажмите на Администрирование. В выпадающем списке кликните Изменить принтер, перейдите к следующей странице(ам), и так далее.

Для всех заданий — «Принтер не отвечает»

Для сетевых принтеров, поскольку CUPS подключается через URI, необходимо убедиться, что в DNS настроен доступ к принтерам по IP. Например, если принтер подключен следующим образом:

то имя хоста ‘BRN_020554’ должно соответствовать IP принтера, управляемого сервером CUPS. Если используется Avahi, убедитесь, что разрешение имени хоста Avahi работает.

Альтернативно, замените имя хоста, используемое в URI, IP-адресом принтера.

Версия PPD не совместима с gutenprint

И перезагрузите CUPS (будет выведено соответствующее сообщение после установки gutenprint).

Проблемы с сетью

Не удается найти принтер

Даже если CUPS обнаруживает сетевые принтеры, вы все равно можете получить ошибку «Не удается найти принтер» («Unable to locate printer») при попытке распечатать что-либо. Чтобы решить эту проблему, включите .разрешение локального имени хоста Avahi. Для получения дополнительной информации смотрите CUPS (Русский)#Сеть.

Эта проблема может возникать и при использовании файрвола (межсетевой экран, брандмауэр). Возможно, вам придется отключить его или установить корректные правила. Если вы используете system-config-printer для обнаружения сетевых принтеров, тогда он сделает все это автоматически.

Старый сервер CUPS

Начиная с версии CUPS 1.6, клиент по умолчанию использует IPP 2.0. Если сервер использует CUPS version=1.1 , описанной в Таблице 2. Опции URI IPP.

Общий принтер работает локально, но удаленный компьютер не печатает

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

Не удается найти файл PPD

Убедитесь, что Avahi настроен правильно. В частности, проверьте, что nss-mdns установлен и настроен в /etc/nsswitch.conf .

USB-принтеры

Конфликт с SANE

Если у вас также запущен SANE, возможно, что он конфликтует с CUPS. Чтобы исправить это, создайте правило Udev, обозначающее устройство как совпадающее с libsane:

Конфликт с usblp

Доступ к USB-принтерам можно получить двумя способами: модулем ядра usblp и libusb. Первый — это классический способ. Это просто: данные отправляются на принтер, записывая их в файл устройства в виде простого последовательного потока данных. Чтение одного и того же файла устройства позволяет использовать двунаправленный доступ, по крайней мере, для таких вещей, как считывание уровней чернил, статуса или информации о возможностях принтера (PJL). Он работает очень хорошо для простых принтеров, но для многофункциональных устройств (принтер/сканер) он не подходит, и производители, такие как HP, поставляют свои собственные бэкенды. Источник: здесь.

Если у вас возникли проблемы с работой USB-принтера, вы можете попробовать запрет загрузки для модуля ядра usblp :

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

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

Если вы используете usblp , вывод должен указывать на то, что принтер был обнаружен следующим образом:

Если вы запретили загрузку usblp , вы увидите что-то вроде:

USB autosuspend

Ядро Linux автоматически приостанавливает USB-устройства, когда есть поддержка драйверов и устройства не используются. Это может сэкономить электроэнергию, но некоторые USB-принтеры считают, что они не подключены, когда ядро приостанавливает USB-порт, предотвращая печать. Это можно устранить, отключив autosuspend для конкретного устройства, для получения дополнительной информации смотрите Power management#USB autosuspend.

Плохие разрешения

Проверьте разрешения USB-порта принтера. Получите номер шины (BUSID) и устройства (DEVID) от lsusb :

Проверьте владельца, просмотрев devfs:

Демон cups запускается от пользователя «cups» и относится к группе «lp», поэтому либо этому пользователю, либо группе требуется доступ на чтение и запись в USB-устройство. Если вы считаете, что разрешения выглядят неправильно, вы можете временно изменить группу и разрешение:

Затем проверьте, может ли cups теперь видеть устройство USB правильно.

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

После редактирования перезагрузите правила udev этой командой:

Каждая система может отличаться, поэтому обратитесь к вики-странице udev (Русский)#Список атрибутов устройства.

Проблемы с HP

CUPS: «/usr/lib/cups/backend/hp failed»

The factual accuracy of this article or section is disputed.

Убедитесь, что dbus установлен и запущен. Если ошибка повторяется, попробуйте запустить avahi-daemon.

Попробуйте добавить принтер в качестве сетевого принтера, используя протокол http:// .

CUPS: «Печать завершена», но принтер не печатает.

Это происходит на принтерах HP, когда вы выбираете (старый) драйвер hpijs (например, для Deskjet D1600 series). Вместо этого используйте драйвер hpcups.

Некоторые принтеры HP требуют, чтобы их прошивка загружалась с компьютера при каждом включении принтера. Вы можете столкнуться с этой проблемой, если есть проблема с udev (или аналогом), и правило загрузки прошивки никогда не запускается. В качестве обходного пути вы можете вручную загрузить прошивку на принтер. Убедитесь, что принтер подключен и включен, затем выполните

CUPS: ‘»foomatic-rip» not available/stopped with status 3’

Если, во время использования принтера HP, задания появляются в очереди, но все завершаются со статусом ‘остановлен’ (‘stopped’), а в /var/log/cups/error_log возникает одно из следующих сообщений об ошибках:

CUPS: «Filter failed»

Ошибка «filter failed» может быть вызвана некоторым количеством причин. Журнал ошибок CUPS (по умолчанию /var/log/cups/error_log ) должен записывать, какой фильтр не удалось загрузить и почему.

Отсутствует ghostscript

Установите ghostscript ( /usr/lib/cups/filter/gstoraster нуждается в его запуске).

Отсутствует foomatic-db

Установите foomatic-db и foomatic-db-ppds . Это помогает в некоторых случаях.

Avahi не включен

Устаревший плагин

Эта ошибка может указывать на то, что плагин устарел (версия несовместима) и может произойти после обновления системы, возможно, появится сообщение Plugin error в журнале (логе). Если вы установили hplip-plugin AUR , вам нужно обновить пакет, иначе перезапустите hp-setup -i , чтобы установить последнюю версию плагина.

Устаревшая конфигурация принтера

Начиная с hplip-plugin AUR версии 3.17.11 hpijs больше не доступен. Если у вас есть принтеры, использующие hpijs, они не будут печатать. Необходимо перенастроить их и выбрать вместо этого новый драйвер hpcups.

Вы можете проверить, если это ваш случай, посмотрев в error_log cups`а:

CUPS: печатает только пустую страницу и страницу с сообщением об ошибке на HP LaserJet

This article or section is out of date.

Существует ошибка, которая приводит к сбою CUPS при печати изображений на HP LaserJet (в моем случае 3380). Ошибки были зафиксированы и исправлены в Ubuntu. Первая страница пуста, вторая страница содержит следующее сообщение об ошибке:

Чтобы устранить проблему, выполните следующую команду как суперпользователь (root):

HPLIP 3.13: Плагин установлен, но HP Device Manager жалуется на его отсутствие

Возможно, проблема связана с изменением прав доступа файла, которое было внесено в /var/lib/hp/hplip.state . Чтобы исправить проблему, достаточно простых команд chmod 644 /var/lib/hp/hplip.state и chmod 755 /var/lib/hp . Для получения дополнительной информации, пожалуйста, прочитайте эту ссылку.

hp-toolbox: «Unable to communicate with device»

Разрешение проблемы

The factual accuracy of this article or section is disputed.

Может потребоваться добавить пользователя в группы lp и sys .

Виртуальный CDROM у принтеров

Это также может быть вызвано принтерами, такими как P1102, которые предоставляют виртуальный привод CD-ROM для драйверов MS Windows. Появляется lp dev, а затем исчезает. В этом случае попробуйте пакеты usb-modeswitch и usb-modeswitch-data, что позволяет отключить «Smart Drive» (правила udev, включенные в указанные пакеты).

Сетевые принтеры

Это также может происходить с сетевыми принтерами, использующими динамические имена хостов, если avahi-daemon не запущен. Другая причина заключается в том, что hp-setup не удалось найти принтер, потому что IP-адрес принтера изменился из-за DHCP. Если это так, подумайте о добавлении резервирования DHCP для принтера в конфигурации сервера DHCP.

hp-setup просит указать PPD-файл для обнаруженного принтера

Кроме того, при выборе файла PPD в графическом режиме hp-setup поле не обновляется и сообщение об ошибке не отображается.

Или, если вы используете интерактивный (консольный) режим, можно столкнуться с чем-то похожим на это даже при введении правильного пути к файлу ppd:

Решение заключается в установке и запуске cups перед запуском hp-setup .

hp-setup: «Qt/PyQt 4 initialization failed»

Установите пакет python-pyqt4 AUR , который дополнительно требуется (optdepend) для hplip . Альтернативно вы можете запустить hp-setup с интерфейсом командной строки с помощью флага -i .

hp-setup: находит принтер автоматически, но сразу после этого сообщает «Unable to communicate with device» при печати тестовой страницы

Это, по крайней мере, происходит с hplip 3.13.5-2 у принтера HP Officejet 6500A через локальное сетевое соединение. Чтобы решить проблему, укажите IP-адрес принтера HP для hp-setup, чтобы обнаружить принтер.

hp-setup: «KeyError: ‘family-class’»

Если при добавлении принтера в пользовательском интерфейсе он не работает, или вы получили KeyError: ‘family-class’ от hp-setup , возможно потребуется обновить вручную /usr/share/hplip/data/models/models.dat .

Проверьте определен ли раздел family-class=Undefined для вашего принтера. Если нет, добавьте это:

Другие

Принтер «приостановлен — «Paused»» или «Остановлен» cо статусом «Рендеринг завершен»

Низкий уровень чернил

При низком уровне чернил некоторые принтеры зависают со статусом «Рендеринг завершен» («Rendering completed»), и, если это сетевой принтер, принтер может даже стать недоступным для CUPS, несмотря на то, что он правильно подключен к сети. Замена картриджа (картриджей) с низким уровнем чернил в этом случае вернет принтер в статус «Готов» («Ready») и, если он — сетевой принтер, то он станет снова доступным для CUPS.

Завершение печати из-за ошибок авторизации

Если удаленный принтер запрашивает аутентификацию, CUPS автоматически добавит директиву AuthInfoRequired для принтера в /etc/cups/printers.conf . Однако некоторые графические приложения (например, некоторые версии LibreOffice [1]) не имеют возможности запрашивать учетные данные, поэтому печать завершилась с ошибкой. Чтобы исправить это, укажите требуемое имя пользователя и пароль в URI. Для получения дополнительной информации смотрите [2], [3].

Unknown supported format: application/postscript

(Не найдена поддержка формата: application/postscript)

в /etc/cups/mime.convs и:

Ошибка задания для печати (Print-Job) client-error-document-format-not-supported

Попробуйте установить пакет foomatic и используйте драйвер foomatic.

Не удается получить список драйверов принтера

(Также применимо к ошибке «-1 не поддерживается!»)

Попробуйте удалить драйверы Foomatic или обратитесь к CUPS/Принтероспецифичные проблемы#HPLIP для обходного пути.

lp: Error — Scheduler Not Responding

Если вы получите эту ошибку, убедитесь, что CUPS запущен, переменная окружения CUPS_SERVER не установлена и /etc/cups/client.conf корректный.

Сообщение об ошибке: «Using invalid Host»

Попробуйте добавить ServerAlias * в /etc/cups/cupsd.conf .

Не удается отправить на печать из LibreOffice

Если вы можете распечатать тестовую страницу с веб-интерфейса CUPS, но не из LibreOffice, попробуйте установить пакет a2ps .

Вывод принтера сдвинут

По-видимому, это связано с неправильным размером страницы, установленным в CUPS.

Принтер не работает (приостановлен — «Paused») после ошибки

Когда во время печати возникает ошибка, принтер в CUPS может перестать отвечать на запросы. lpq сообщает, что принтер is not ready (не готов), его можно активировать с помощью cupsenable . В веб-интерфейсе CUPS принтер отображается как приостановлен — «Paused», его можно возобновить с помощью Восстановить печать.

Чтобы CUPS автоматически активировал принтер, измените политику ошибок с стандартной настройки Останавливать принтер (stop-printer) на Повторить задание (retry-this-job).

Samsung: URF ERROR — Incomplete Session by time out

Эта ошибка обычно возникает при печати файлов по сети через IPP на принтерах Samsung и решается с помощью пакета samsung-unified-driver AUR .

Brother: Принтер печатает несколько копий

Иногда принтер печатает несколько копий документа (например, MFC-9330CDW напечатал 10 копий). Решение заключается в обновлении прошивки принтера.

Обычный пользователь не может изменять настройки принтера или удалять определенные задания

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

Источник

Ресурсы блокировки рендеринга — это статические файлы, такие как файлы шрифтов, HTML, CSS и JavaScript, которые жизненно важны для процесса рендеринга веб-страницы. Когда браузер сталкивается с ресурсом блокировки рендеринга, он прекращает загрузку остальных ресурсов до тех пор, пока эти критические файлы не будут обработаны. Тем временем весь процесс рендеринга приостанавливается. С другой стороны, ресурсы, не блокирующие рендеринг, не откладывают рендеринг страницы. Браузер может безопасно загрузить их в фоновом режиме после отрисовки начальной страницы.

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

Зачем устранять ресурсы, блокирующие рендеринг?

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

Есть три способа уменьшить количество и влияние ресурсов, блокирующих рендеринг:

1. Сделайте их не блокирующими рендеринг ресурсами, отложив их загрузку
2. Уменьшите общее количество ресурсов, блокирующих рендеринг, используя такие методы, как объединение (это также означает меньше HTTP-запросов)
3. Уменьшите размер ресурса с помощью минификации, чтобы на странице было меньше байтов для загрузки

Типы ресурсов, блокирующих рендеринг

Как правило, браузер обрабатывает все, что находит в разделе <head> HTML-страницы, как блокировку рендеринга. Это включает в себя:

1. Таблицы стилей CSS
2. Файлы JavaScript добавленные в раздел <head>
3. Шрифты, добавленные либо из CDN, либо с локального сервера
4. Импорт HTML (хотя импорт HTML теперь устарел, вы все еще можете встретить его на старых страницах)

Изображения, медиафайлы и теги <script>, размещенные внизу раздела <body>, рассматриваются как ресурсы, не блокирующие рендеринг.

Теперь давайте рассмотрим пять стратегий для устранения или уменьшения количества и воздействия ресурсов, блокирующих рендеринг.

1. Не добавляйте CSS с правилом @import

Вы можете добавить CSS на страницу, используя:

1. Тег <link rel="stylesheet">, который нужно добавить в свой HTML — файл
2. Правило @import, которое вам нужно добавить в ваш CSS-файл

Несмотря на то, что правило @import сохраняет ваш HTML-файл более чистым и позволяет хранить все ваши CSS-зависимости в одном месте, это не лучший выбор с точки зрения производительности. Правило @import позволяет импортировать CSS из других таблиц стилей, но это приводит к тому, что браузер обрабатывает ваш CSS-файл медленнее, поскольку ему также приходится загружать импортированные файлы. Пока это не произойдет, процесс рендеринга будет заблокирован.

Если вы хотите добавить на свою страницу более одного файла CSS, вы можете либо использовать тег <link>, либо объединить файлы с помощью инструмента минификации и / или объединения.

Вам нужно добавить элемент <link> в раздел <head> HTML-страницы следующим образом:

<head>
  <link href="style.css" rel="stylesheet">
</head>

2. Используйте атрибут media для условного CSS

По умолчанию браузер обрабатывает все файлы CSS как ресурсы, блокирующие рендеринг. Однако, если вы добавите атрибут media к тегу <link>, вы можете указать браузеру наличие условного файла CSS.

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

<link href="print.css" rel="stylesheet" media="print">
<link href="large.css" rel="stylesheet" media="screen and (min-width: 1500px)">
<link href="mobile.css" rel="stylesheet" media="screen and (max-width: 600px)">

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

Например, таблица стилей mobile.css в приведенном выше примере будет блокировать рендеринг на мобильных устройствах с максимальной шириной области просмотра 600px и не блокировать рендеринг в окнах просмотра больше 600px.

Если у вас есть файл CSS с одним или несколькими медиа-запросами, вы можете извлечь все правила @media и сохранить их в виде отдельных файлов с помощью этого плагина PostCSS. Этот метод оптимизации производительности также называется разделением кода. Хотя разделение кода обычно упоминается в связи с JavaScript, вы также можете разделить большие файлы CSS и загружать каждый файл только тогда, когда это необходимо, чтобы сократить критический путь рендеринга и уменьшить время загрузки начальной страницы.

3. Используйте атрибуты defer и async для устранения визуализации блокировки JavaScript

Файлы JavaScript, добавленные в раздел документа <head>, по умолчанию обрабатываются как ресурсы, блокирующие рендеринг.

Вы можете удалить их из критического пути рендеринга, разместив теги <script> прямо перед закрывающим тегом </body> вместо раздела <head>. В этом случае они начнут загружаться только после того, как будет загружен весь HTML. Однако, поскольку загрузка этих сценариев начинается позже, загружаемые ими элементы, такие как реклама, анимация или динамические функции, могут загружаться позже, чем остальная часть внешнего интерфейса, особенно если это более длинный сценарий. Это может привести к заметным задержкам и отставанию пользовательского интерфейса при более медленных соединениях, что плохо для пользователя.

В атрибутах defer и async тега <script> предлагают решение этой проблемы. Оба являются логическими атрибутами, что означает, что если вы их добавите, они будут срабатывать без какой-либо дополнительной настройки. Они также добавляют скрипты в раздел <head> HTML-документа без блокировки рендеринга, но другим способом — отложенные скрипты соблюдают порядок документа, в то время как асинхронные скрипты не зависят от DOM.

Атрибут defer указывает браузеру загружать скрипт в фоновом режиме, чтобы он не блокировал рендеринг страницы. Отложенный сценарий выполняется после того, как DOM будет готов, но до того, как сработает событие DOMContentLoaded.

<script src="script01.js" defer></script>
<script src="script02.js" defer></script>

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

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

Например, в приведенном ниже примере мы не можем быть уверены, какой сценарий запустится первым; это зависит исключительно от того, что загружается быстрее (обычно меньшее). Помните, что асинхронные сценарии независимы как от документа, так и друг от друга, поэтому порядок документов никоим образом не повлияет на них.

<script src="script03.js" async></script>
<script src="script04.js" async></script>

Атрибут defer рекомендуется использовать для сценариев, которым требуется DOM, но вы хотите начать их загрузку до загрузки документа, не превращая их в блокирующий рендер ресурс. Вы также должны использовать defer, а не async, если порядок документов важен — например, когда последовательные сценарии зависят друг от друга.

Атрибут async рекомендуется использовать для независимых сторонних скриптов, таких как рекламные объявления, трекеры и аналитические скрипты. Например, Google Analytics рекомендует добавить атрибут async для поддержки асинхронной загрузки в современных браузерах.

4. Минимизируйте и объедините CSS и JavaScript.

Помимо удаления несущественных CSS и JavaScript из критического пути рендеринга, вы также можете минимизировать и объединить ресурсы, блокирующие рендеринг, и ресурсы, не блокирующие рендеринг.

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

Существует множество инструментов, которые помогут вам выполнить минификацию и объединение в соответствии с передовыми практиками, включая Minify, CSS Minifier, Minify Code и PostCSS. Инструменты сборки, такие как webpack, Parcel и Rollup, имеют встроенные функции минификации, объединения и разделения кода, которые позволяют быстро уменьшить количество ресурсов, блокирующих рендеринг.

5. Загрузите пользовательские шрифты локально.

Поскольку пользовательские шрифты вызываются из раздела <head> документа, они также блокируют отображение ресурсов. Например:

<link href="https://fonts.googleapis.com/css2?family=Lato&display=swap" rel="stylesheet"> 

Вы можете уменьшить влияние пользовательских шрифтов на начальную отрисовку страницы, добавляя их локально, а не извлекая их из сети доставки контента, такой как Google CDN. Поставщики шрифтов, как правило, добавляют несколько правил @font-face, многие из которых вам не понадобятся.

Например, Google Fonts добавляет правила @font-face для всех наборов символов, с которыми идет гарнитура, таких как латиница, кириллица, китайский, вьетнамский и другие. Скажем, например, что онлайн-файл CSS, который вы добавляете с тегом <link>, включает правила @font-face для семи различных наборов символов, но вы хотите использовать только один (например, латинский). Однако шрифты Google не загружают файлы шрифтов для всех наборов символов; они просто добавляют много избыточных правил @font-face в файл CSS.

Если вы добавляете шрифты локально, вы также можете минимизировать свой CSS, связанный со шрифтами, и связать его с остальной частью вашего CSS. Вы можете использовать Google Web Fonts Helper для быстрого создания локальных правил @font-face для Google Fonts. Например, вот что вам нужно добавить, чтобы включить начертание шрифта Lato Regular:

/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Lato Regular'), local('Lato-Regular'),
       url('../fonts/lato-v16-latin-regular.woff2') format('woff2'),
       url('../fonts/lato-v16-latin-regular.woff') format('woff');
}

Обратите внимание, что Google Web Fonts Helper не добавляет правила font-display: swap; я сам добавил это в указанное выше объявление. Это дескриптор правила @font-face, позволяющего указать, как браузер должен отображать начертание шрифта на странице.

Используя font-display со значением swap, вы даете команду браузеру немедленно начать использовать системный шрифт и заменить его пользовательским шрифтом после загрузки (это правило также добавляется, когда вы извлекаете шрифт из CDN Google). Это позволяет избежать невидимого текста на странице, пока пользовательский шрифт все еще загружается.

Когда вы загружаете шрифты локально, убедитесь, что вы обслуживаете сжатые форматы шрифтов для современных браузеров, таких как WOFF и WOFF2. Помните, что более легкие файлы также уменьшают влияние ресурсов, блокирующих рендеринг. Помимо создания правил @font-face, Google Web Fonts Helper также позволяет загружать заархивированный файл, содержащий все нужные вам форматы шрифтов.

Почему не следует загружать пользовательские шрифты асинхронно

В некоторых статьях о ресурсах блокировки рендеринга рекомендуется использовать загрузчик веб-шрифтов TypeKit для асинхронной загрузки пользовательских шрифтов. Когда-то это был достойный инструмент, но он не обновлялся с 2017 года, и у него много нерешенных проблем. Я бы не рекомендовал его использовать.

Хотя асинхронная загрузка шрифтов сокращает критический путь рендеринга, вы всегда должны делать это осторожно. Если шрифты загружаются позже, чем содержимое страницы, на странице может возникнуть общая проблема UX, называемая миганием невидимого текста (FOIT).

Существуют различные способы, чтобы справиться с FOIT, например, использование сторонних библиотек или вышеупомянутое правило font-display: swap (см. поддержка браузера для font-display, плюс, обратите внимание, что использовать его с правилом swap просто превращает FOIT в FOUT — вспышка неокрашенного текста — но это не полностью устраняет проблему). Тем не менее, вы захотите потратить время на обдумывание того, действительно ли стоит идти по асинхронному маршруту с точки зрения производительности. Подумайте о весе дополнительных скриптов, потенциальных проблемах, пользователях с отключенным JavaScript (вам все равно нужно добавить статический элемент <link> в теги <noscript> для их поддержки) и т. д.

Резюме

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

1. Не используйте импорт CSS
2. Загрузить условный CSS с атрибутами media
3. Используйте атрибуты defer и async для устранения рендер блокировки JavaScript
4. Разделение, объединение и минимизация файлов CSS и JavaScript
5. Локальная загрузка пользовательских шрифтов

Чтобы найти файлы блокировки рендеринга, вы можете использовать инструменты анализа производительности, такие как Lighthouse, web.dev (тот же инструмент, что и Lighthouse, только интегрированный в веб-приложение), GTmetrix и другие. Эти инструменты не только помогают найти ресурсы, блокирующие рендеринг, но и предлагают практические советы, которые помогут повысить производительность вашего сайта.

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

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

( 2 оценки, среднее 2 из 5 )

Продолжительное время бьюсь над следующей проблемой с ExtJs (использую Ext.NET 2.1).

Почему-то криво рендерится страница после загрузки. Где-то блоки съезжают, где-то не так посчитаны размеры и положение… При этом всё исправляется после изменения размеров окна или выполнения метода doLayout() какого-нибудь контейнера.

В старых версиях (Ext.NET 1) всё работало (хотя, возможно, что и там было подобное местами, не уверен), а на новых версиях стало вот так.

Что это может быть и как исправлять?

Даже не уверен, это ошибки рендеринга, или просто где-то валится на какой-то ошибке.

Реальных ошибок при этом нет. Пробовал в отладчике ставить stop на всех ошибках – ничего не нашёл, кроме одного DOMException ещё при инициализации ResourceManager. Но он ловится catch и вроде всё нормально работает. Такой же Exception выпадает даже на их сайте с примерами, но всё там корректно работает.

Бывают случаи, когда принтер не распечатывает документ. В лотке есть бумага, но он не работает. Или же выдает чистую бумагу или листы с размазанными пятнами. Давайте узнаем, что делать.

Принтер выдает ошибку печати: причины

Существует несколько основных причин, по которым принтер выдает ошибки:

1. Устарел или отсутствует драйвер.
2. Залипли контакты.
3. Принтер неправильно подключен.
4. Выставлены неправильные настройки.
5. В картридже нет чернил.
6. Возможно, к компьютеру подключено сразу несколько устройств, и он не может определить одно.

Важно! Большинство видов ошибок можно решить дома, не отвозя принтер в сервисный центр.

Как исправить ошибку печати

Процесс исправления будет зависеть от вида ошибки. Например, если проблема в драйвере (обычно это в 90% случаев) делаем следующее:

1. Заходим в «Пуск», «Панель управления», раздел «Устройства и принтеры».
2. У нас высветит окно со всеми устройствами, которые на данный момент подключены к компьютеру. Ищем нужное нам.
3. Проверяем значок. Если он зеленый, значит, проблема не в драйвере. Ищем другую причину.
4. Если причина в драйвере, его необходимо переустановить. В комплекте должен быть диск с драйвером. Если диска нет, утилиту можно скачать с интернета.
5. Выполнив несколько шагов по установке (в этом поможет мастер установки), пробуем распечатать лист.

Возможно причина в проводе. У стандартных проводов часто плохая скорость передачи. Порой, чтобы передать документацию другому оборудованию приходится ждать больше часа. Если вы столкнулись с такой проблемой, следует купить кабель, оснащенный ферритовыми кольцами. Провод стабильнее, и способен быстро передавать документы (скорость передачи выше в 5 раза).

Внимание! Кабель также может быть поврежден. Возможно, сломан штекер, или залипли контакты. Здесь уже лучше обращаться в сервисный центр.

Проверьте свойства оборудования. Если высвечивает окно Ошибка печати, делаем следующее:

1. Заходим в «Пуск». Открываем «Принтеры и факсы».
2. Ищем нужное оборудование. Нажимаем на нем правой клавишей мыши.
3. У нас высветит меню, где нужно выбрать строчку «Свойства».
4. Там появится окно. Ищем раздел «Обмен данными».
5. Там выбираем «Отключить».
6. Перезапускаем оборудование.

Другой метод – найти изображение оборудования, два раза нажать по нему левой клавишей мыши. Проверяем в каком режиме работает оборудование. Если высветит, что в автономном, меняем параметр. Делаем следующее:

1. Заходим в «Устройства и принтеры».
2. У нас высветит окно, где нужно выбрать аппарат.
3. Нажимаем на него. Выпадает окно, где нужно убрать галочку рядом со строчкой «Работать автономно».
4. Убеждаемся, что очередь очищена, и перезапускаем оборудование.

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

Возможно, к компьютеру подключено одновременно несколько принтеров, и не получается определить, на какой нужно выводить текст. Делаем следующее:

1. Открываем «Устройства и принтеры».
2. Там высветит окно, со всеми подключенными на данный момент приборами.
3. Ищем необходимое нам устройство. Убеждаемся, что оно подключено (смотрите статус).
4. Нажимаем на принтер правой клавишей мыши, и выбираем строчку «Использовать по умолчанию».
5. Возле устройства должна появиться зеленая галочка. Если же она бледная, компьютер не может определить устройство.

Проверьте правильность подключения. Возможно, ошибка появилась недавно (раньше принтер работал исправно). Перезапускаем устройство и компьютер. Осматриваем провода на предмет повреждений.

Важно! Очень часто ошибка печати появляется, если выбран неправильный принтер (то есть подключено сразу несколько, и компьютер не видит нужный нам). Но все же ошибка драйвера более распространенное явление.

Если все перечисленные шаги не помогли, есть вероятность, что одна из деталей оборудования вышла из строя. Устройство придется везти в сервисный центр. Попробуйте также проверить работоспособность USB-разъема на компьютере. Просто подключите флешку, чтобы убедиться, что он работает.