Веб-страница
25.3K subscribers
1.53K photos
483 videos
1 file
3.72K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
Самое интересное с Chrome Web Dev Summit 2019

https://tprg.ru/LlE0

В середине ноября прошла конференция по вебу от разработчиков Chrome. Что там рассказали:
— переработанные элементы <form> и новые HTML-элементы;
— новые функции и селекторы CSS;
— сближение натива и веба;
— концепция «адаптивной загрузки».

Видосы с конференции на YouTube: https://tprg.ru/P8xm

#chrome #html #css
This media is not supported in your browser
VIEW IN TELEGRAM
Знали, что в инструментах разработчика Chrome есть специальный инспектор для CSS-анимаций?

Можно управлять синхронизацией, задержками, продолжительностью и т.д. Чтобы попасть в этот инспектор, в меню инструментов разработчика выберите «More tools», а затем «Animations».

#фронтенд #css #chrome
This media is not supported in your browser
VIEW IN TELEGRAM
В инструментах разработчика Google Chrome есть возможность скопировать любой запрос на вкладке Network в виде команды cURL. Все заголовки и кукисы включены т.е. можно полностью повторить HTTP-реквест вне браузера.

Но можно ещё круче. Берём команду cURL из буфера и вставляем вот тут: https://curl.trillworks.com/. Получаем готовый код на Pyhton, Go, PHP или на чём вы там сейчас пишите.

Это удобно, когда работаете с сайтами, которые проверяют заголовки или ещё какие-то условия, которые просто так сразу не видно.

#chrome #браузеры
Google вернёт в Chrome поддержку FTP по умолчанию, которую только недавно убрал

Как мы писали ранее, Google планировал прекратить поддержку протокола FTP в своём браузере из-за небезопасности и непопулярности протокола. В последней версии Chrome поддержка протокола была отключена по умолчанию, а в версии 82 планировалось полностью выпилить весь связанный с этим код.

Теперь же, на фоне новостей о пропуске 82-й версии Chrome, в компании заявили, что вынуждены вернуть к жизни старый протокол «в свете текущего кризиса». Каким образом связан отказ от FTP и нынешний кризис, в компании не уточнили.

Источник: Bleeping Computer

#ftp #chrome
Вышла новая версия ChromeChrome 83

Интересное из нововведений:

— Из origin trial вышел Trusted Types API, который позволяет избежать DOM-based XSS атак, блокируя прямой доступ к потенциально небезопасным частям web-платформы.

— В рамках origin tirals доступны performance.measureMemory() — новое API для мониторинга потребления памяти страницей и Native File System API для упрощения работы с файлами в веб-приложениях.

— В Chrome Dev Tools теперь можно эмулировать проблемы со зрением и разные локали.

— А ещё были обновлены встроенные html-контролы — унифицирован внешний вид, улучшена поддержка клавиатуры и тач-ввода.

Источник: Defront

#chrome
Актуальная статья про приоритеты ресурсов в Chrome (а значит и примерно во всём интернете):

https://tprg.ru/XYIi

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

#chrome
Какие расширения тормозят ваш Chrome

DebugBear проанализировал 1000 популярных расширений браузера и сделал выводы на базе таких показателей:

— Время блокировки основного потока
— Задержка рендеринга страницы
— Время обработки в фоновом режиме
— Количество потребляемой браузером памяти

Если расширений нет, условный сайт загрузится за 40 мс. Если же вы установите Evernote или Grammarly, время загрузки возрастёт до 500 мс. А пока вы не начали массово искоренять расширения, посмотрите саму статью — там интересно:

https://tprg.ru/aeSt

#chrome
Забавные комиксы о Google Chrome и Kubernetes

А ещё познавательные: из них вы узнаете, как работают эти инструменты и в чём их главные преимущества.

Google Chrome: https://tprg.ru/ZKSn
Kubernetes: https://tprg.ru/VCPq

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

Как вам комиксы?

#kubernetes #chrome
То, как браузеры планируют и выполняют сценарии, может повлиять на производительность веб-страниц. Держите шпаргалку по приоритетам загрузки JavaScript в Chrome:

https://tprg.ru/FKpM

#javascript #chrome
Компания Google выпустила Chrome 86

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

— Функция Safety Check, предупреждающая о небезопасных комбинациях логин/пароль, теперь доступна в мобильных версиях Chrome.
— Появилось предупреждение об отправке заполненных данных через незашифрованный канал связи.
— В контекстном меню по умолчанию есть опция «Всегда показывать URL полностью».
— Предусмотрена блокировка небезопасной загрузки архивов и вывод предупреждения при небезопасной загрузке документов.
— Для небольшого процента пользователей запущен эксперимент по отображению по умолчанию в адресной строке только домена.
— По умолчанию доступен File System Access API, позволяющий создавать приложения для взаимодействия с локальными файлам.

Кроме того, добавлен CSS-селектор :focus-visible, поддержка псевдоэлемента ::marker для стилизации маркеров списка, изменено кодирование пробела в URL с «+» на «%20», расширены инструменты для web-разработчиков и многое другое. Выпуск Chrome 87 запланирован на 17 ноября.

Подробнее: https://tprg.ru/HwZY

#браузеры #chrome
👍1
Разделение кэша в Chrome 86

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

— определение посещённых сайтов;
— межсайтовый скриптинг;
— межсайтовое отслеживание.

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

Подробнее о новом кэшировании в Google Chrome 86:
https://tprg.ru/GjWL

#браузеры #chrome
Проекты и инструменты для работы с Chrome DevTools

В подборку вошли тулзы для:

— форматирования объектов;
— проверки сети;
— профилирования процессора;
— временных графиков и трассировки;
— интеграции отладчика Chrome с IDE.

В статье вы также найдёте информацию о протоколе Chrome DevTools, библиотеки для работы с ним, адаптеры браузеров и расширения инструментов разработчика:

https://tprg.ru/HBmW

#браузеры #chrome
Обновление Google Chrome увеличило время работы ноутбуков от одного заряда

Теперь портативные компьютеры смогут работать на 1.25 часа дольше в режиме веб-сёрфинга. С производительностью у обновлённого Chrome также полный порядок: по заверениям поискового гиганта, браузер стал запускаться на 25% быстрее, а скорость открытия новых вкладок увеличилась на 7%.

Подробнее читайте в нашей статье:
https://tprg.ru/7tTb

#браузеры #chrome
Сегодня стартует Chrome Dev Summit

Трансляция первого доклада «Chrome и Веб в 2020» начнётся в 20:30 по московскому времени.

Всего на два дня запланировано 26 выступлений — по 13 каждый день.

Трансляция доступна тут:
https://www.youtube.com/watch?v=NkIi7h8NnS4

Посмотреть подробную программу саммита можно тут:
https://developer.chrome.com/devsummit/schedule/
Расширение CSS Peeper

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

Подробнее узнать и установить можно тут:

https://tprg.ru/URBT

#css #chrome
Полное дерево доступности в Chrome DevTools

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

https://tprg.ru/aMcB

#chrome
👍4
Как создать Chrome-расширение для приложения с прогнозом погоды

В статье описывается процесс создания Chrome-расширения для отображения прогноза погоды. Автор подробно объясняет, как настроить манифест, как добавить иконки, как написать код для взаимодействия с внешним API. Эта статья пригодится как начинающим, так и опытным веб-разработчикам, которые хотят создать своё первое расширение для браузера и разобраться, как расширения работают на практике.

https://nuancesprog.ru/p/16733/

#chrome #бэкенд
👍11
Создать Chrome OS и остаться неизвестным: история Джеффа Нельсона

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

Если не хотите повторить его судьбу, то вам стоит узнать, кто же такой Джефф Нельсон, как строилась его карьера, как он придумал Chrome OS и почему он всё-таки остался неизвестным разработчиком:

https://tproger.ru/articles/sozdat-chromeos-i-ostatsya-neizvestnym-istoriya-dzheffa-nelsona/?utm_source=tg&

#chrome #os
👍72
​​Google Chrome начнет защищать от фишинга в реальном времени

Google объявила войну злодеям в интернете, внедрив новые возможности в свой браузер Chromehttps://tproger.ru/articles/google-chrome-nachnet-zashhishhat-ot-fiwinga-i-virusov-v-realnom-vremeni

Раньше Chrome сравнивал адрес сайта со списком опасных, который обновлялся раз в полчаса. А мошенники наловчились создавать левые сайты на пару минут, успевая делать гадости.

Google решили это исправить и тепер защита от вирусов и фишинга работает в реальном времени. Chrome мгновенно сверяется с базой Google, где хранится инфа о «плохих» сайтах. Результат: на 25% больше заблокированных мошеннических страниц.

Google обещает, что вся проверка происходит анонимно и безопасно. Обновление вот-вот появится в Chrome для компьютеров и iOS. А в течение месяца еще и на Android.

@tproger_web #безопасность #chrome #google
🔥13👍5😁1
Как создавать сложные расширения Chrome

Создать сложное расширение для браузера не так-то просто, особенно для новичков.

Но не волнуйтесь. Это руководство покажет вам, как сделать полнофункциональное расширение для Chrome на реальном примере!

В итоге у вас получится расширение для сохранения изображения с любых сайтов в ваш сервис через API.

#extensions #chrome
👍9🥰2