Трамп, два гендера, веб-разработчики
@mistermorak_ Extra work for developers this week 🥺. . #webdeveloper
как не ронять сервер на больших выгрузках / Хабр | Веб-студия Nat.od.ua
как не ронять сервер на больших выгрузках / Хабр
Бытует мнение, что Битрикс прожорлив, и способен поглотить все ресурсы, которые есть на сервере. Такая проблема действительно существует, и компаниям иногда приходится рассматривать покупку другой конфигурации сервера, например, при сильном расширении ассортимента или увеличении количества задач бизнеса, решаемых обращением к БД.
Посмотрим, как можно сэкономить ресурсы сервера, чтобы таких вопросов не возникало.
Зачем это надо
Сначала приведём пример стандартной задачи и покажем, что оперативная память сервера быстро расходуется при использовании метода GetList. А затем разберёмся, как избежать проблемы.
Итак, у нас есть интернет-магазин на 50 000 товаров. У каждого товара есть 20 пользовательских свойств. Задача: пробежаться по всем товарам и что-то сделать, изменить какие-то свойства или выгрузить каталог.
В данном примере я показываю код в исследовательских целях.
Итак, что обычно делает программист Битрикс, когда надо получить элементы каталога:
$elements = CIBlockElement::GetList(
array(),
array(«IBLOCK_ID» => $iblockId),
false,
false,
array(«ID», «IBLOCK_ID», «NAME»)
);
while ($element = $elements->GetNextElement()) {
$el=$element->GetFields();
$el=$element->GetProperties();
$items[]=$resElement;
}
На выгрузках в несколько тысяч элементов этот код сработает, и мы получим список элементов. Но уже на 20 000 элементах сервер отправляется в даун. Что же происходит, и почему сервер падает?
Чтобы это выяснить, используем дебаг методы Битрикс и метод PHP memory_get_usage(), который позволяет получить количество используемой оперативной памяти.
$debuglable=»main»;
BitrixMainDiagDebug::startTimeLabel($debuglable);
echo «
Количество используемой оперативной памяти: ". round(memory_get_usage() / 1024 / 1024, 2) . ' MB'. PHP_EOL."
«;
$counter=1;
$elements = CIBlockElement::GetList(
array(),
array(«IBLOCK_ID» => $iblockId),
false,
,
array(«ID», «IBLOCK_ID», «NAME»)
);
while ($element = $elements->GetNextElement()) {
$el=$element->GetFields();
$el=$element->GetProperties();
$items[]=$resElement;
}
echo «
Количество используемой оперативной памяти: ". round(memory_get_usage() / 1024 / 1024, 2) . ' MB'. PHP_EOL."
«;
BitrixMainDiagDebug::endTimeLabel($debuglable);
$lable= BitrixMainDiagDebug::getTimeLabels();
echo «Выборка из «.$counter.» элементов :
"; echo 'Время выполнения скрипта: '. $lable; echo "
«;
Получим такой результат (рис.1). Зафиксируем, что размер выборки одного элемента составляет около 1,5 Мб.
Рис. 1. Выборка из 1 элемента.
Увеличим выборку до 10 элементов, изменяя переменную $counter, для регулирования количества выводимых элементов:
Рис. 2. Выборка из 10 элементов.
Увеличим выборку до 100 элементов:
Рис. 3. Выборка из 100 элементов.
Ну и увеличим до 1000 элементов:
Рис. 4. Выборка из 1000 элементов.
Итак, мы видим что при увеличении количества элементов быстро растёт потребление оперативной памяти, что в конечном счете приводит к тому, что объём данных превышает размер оперативной памяти сервера и сервер падает.
Конечно, данную проблему можно решить разбив запрос на несколько, используя параметр nOffset, запустить цикл, получить результат нескольких запросов и решить вопрос.
Но так мы не решаем проблему, а скорее ее усугубляем. Усложняем код и получаем цикл запросов к БД.
Есть другой путь?
Можно использовать ключевое слово yield в PHP для создания функции-генератора. Какая польза от yield в PHP?
Возможно, вы уже слышали, но на практике ещё не применяли. Обратимся к справке PHP:
Когда вызывается генератор, он возвращает объект, который можно итерировать. Когда вы итерируете этот объект (например, в цикле foreach), PHP вызывает методы итерации объекта каждый раз, когда вам нужно новое значение, после чего сохраняет состояние генератора и при следующем вызове возвращает следующее значение.
Когда все значения в генераторе закончились, генератор просто завершит работу, ничего не вернув. После этого основной код продолжит работу, как если бы в массиве закончились элементы для перебора.
Вся суть генератора заключается в ключевом слове yield. В самом простом варианте оператор «yield» можно рассматривать как оператор «return», за исключением того, что вместо прекращения работы функции, «yield» только приостанавливает её выполнение и возвращает текущее значение, и при следующем вызове функции она возобновит выполнение с места, на котором прервалась.
Как применить yield в нашем случае и что мы получим:
// Функция-генератор для получения свойств элемента инфоблока
function getProperties($elements)
{
while ($element = $elements->GetNextElement()) {
$resElement=$element->GetFields();
$resElement=$element->GetProperties();
yield $resElement;
}
}
$iblockId=7;
$counter=1;
echo «
Количество используемой оперативной памяти: ". round(memory_get_usage() / 1024 / 1024, 2) . ' MB'. PHP_EOL."
«;
// Получение всех элементов инфоблока
$elements = CIBlockElement::GetList(
array(),
array(«IBLOCK_ID» => $iblockId),
false,
,
array(«ID», «IBLOCK_ID», «NAME»)
);
$propertyes=getProperties($elements);
echo «
Количество используемой оперативной памяти: ". round(memory_get_usage() / 1024 / 1024, 2) . ' MB'. PHP_EOL."
«;
BitrixMainDiagDebug::endTimeLabel($debuglable);
$lable= BitrixMainDiagDebug::getTimeLabels();
echo «Выборка из «.$counter.» элементов :
"; echo 'Время выполнения скрипта: '. $lable; echo "
«;
При выборке одного элемента результат тот же что и при первом методе:
Рис. 5. Использование генератора: выборка из 1 элемента.
При выборке 10 элементов потребление памяти не меняется:
Рис. 6. Использование генератора: выборка из 10 элементов.
На 100 элементах потребление памяти также не растёт:
Рис. 7. Использование генератора: выборка из 100 элементов.
Ну и проведём финальный эксперимент. Сделаем выборку из 20 000 элементов. Помним, что при первом варианте такая выборка укладывала сервер.
В результате скрипт выполнялся минуту, но потребление памяти выросло совсем немного:
Рис. 8. Использование генератора: выборка из 20 000 элементов.
За счет чего мы получили такой результат? Ответ кроется в природе генераторов. При создании массива весь массив помещается в память целиком, а при использовании генератора при итерировании вы каждый раз получаете только один элемент итерируемого массива. Что и позволяет снизить потребление оперативной памяти.
В результате мы получили легкий понятный код. Не переусложнёный пагинацией обращений к БД. И то, что при первом варианте в принципе было невозможно на текущей конфигурации сервера, теперь выполняется, и мы получаем необходимый нам результат.
Где в Битрикс можно применить данный подход?
Во-первых, это всё, что связано с выгрузкой каталога интернет-магазина: формирование прайслистов, фидов и другое.
Во-вторых, обработка данных пользователей:
-
чистка от регистраций ботов,
-
изменение формата телефонов,
-
добавление или удаление каких-то свойств.
В-третьих, это массовое изменение свойств товаров: цен, характеристик и т.п.
А также другие задачи, для выполнения которых требуется выгрузка большого количества элементов.
P.S. Ну и напоследок скажу, что для обработки массивов и объектов PHP предлагает удобные инструменты библиотеки SPL — набор классов для итерации объектов. При их использовании у вас появляются дополнительные возможности при итерировании массивов и объектов.
7 тегов, которые упростят вам жизнь / Хабр | Веб-студия Nat.od.ua
7 тегов, которые упростят вам жизнь / Хабр
В этой статье я расскажу про 7 HTML-тегов, которые, возможно, вы еще не открыли для себя. Мы посмотрим, как они работают и насколько поддерживаются современными браузерами. Поехали!
/
Это теги для добавления текста с надстрочным и подстрочным индексами.
Иногда нам нужно выделить символы или цифры, которые находятся выше или ниже базовой линии текста. Например, в химии для обозначения химических формул, в математике для записи степеней и индексов, в музыке для обозначения аккордов, или просто для оформления сносок и сокращений. Все это можно легко достичь с помощью тегов и .
Никаких атрибутов не требуют.
Пример использования в математическом выражении:
Σi=1n (xi2 + yi2)
Результат вывода кода
Пример использования в музыке:
Песня: «Wonderful Tonight» by Eric Clapton
A E7
It’s late in the evening
D A
She’s wondering what clothes to wear
A E7
She puts on her make-up
D A
And brushes her long blonde hair
На данный момент, по статистике caniuse, поддерживаемость тегов , на уровне 96%:
/
Это теги для оформления текста, связанного с клавишами и выводом кода.
— используется для обозначения клавиш на клавиатуре или клавиатурных комбинаций. Это может быть полезно, например, при создании инструкций или руководств по использованию программного обеспечения.
Пример:
Нажмите Enter, чтобы продолжить.
— этот тег используется для отображения вывода кода, результатов выполнения программы. Этот тег может быть полезен при демонстрации примеров кода на веб-странице.
Пример:
Для вывода текста на экран в Python используется функция print().
P.S. Также существует тег ,который по сути делает то же самое, однако, разница состоит в том, что используется для отображения программного кода, а — для отображения результата выполнения этого кода.
Поддерживаемость браузерами тегов и :
(Bi-Directional Override) используется для изменения направления текста. Это особенно полезно при работе с языками, которые читаются справа налево, такими как, например, арабский или иврит.
Тег в HTML имеет всего один обязательный атрибут:
Пример:
مرحبا بك في موقع الويب
Привет, это обратное направление текста
Привет, это обратное направление текста
Также существует CSS свойство direction, которое позволяет делать то же самое, но более глобально, на уровне стилей:
HTML:
Это текст с измененным направлением.
CSS:
.right-to-left {
direction: rtl; /* Устанавливаем направление текста справа налево */
}
Поддерживаемость тега:
Этот тег используется для расшифровки аббревиатур и акронимов. В этом примере используется для создания аббревиатуры "HTML" с полным расшифровкой "HyperText Markup Language". Если навести курсор мыши на аббревиатуру, то можно увидеть всплывающую подсказку с полной расшифровкой.
Атрибуты:
title — используется для расшифровки аббревиатуры/акронима. Когда юзер наводит курсор мыши на аббревиатуру, всплывает подсказка (tooltip) с тем текстом, что был указан в атрибуте.
NASA, является ведущей организацией в области исследования космоса и аэронавтики.
Поддерживаемость браузера опять составляет 96,16%:
Этот тег используется внутри элемента
Чаще всего с optgroup используются атрибуты label и disabled:
Атрибут label используется для установки названия группы вариантов выбора внутри
Результат кода:
Атрибут disabled применяется для отключения группы вариантов выбора. Когда группа
Поддерживаемость браузерами — 96,16%:
Продолжая тему выпадающих списков, стоит рассказать про тег
Тег
Чтобы указать, какой список вариантов должен отображаться для какого поля ввода,
А еще этот тег поддерживает функцию автозавершения: браузер автоматически заканчивает ввод пользователя на основе доступных вариантов из списка
Тег
Использование с типом color:
Использование с типом range:
Поддерживаемость браузерами составляет 96,48%:
Теги
используются для создания спойлеров и скрытой информации без использования JavaScript. Эта пара может быть полезна для создания, к примеру, FAQ-страницы, фильтров и сортировок (указание скрытых свойств для экономии места), инструкций, руководств и комментариев.
Внутрь тега
помещается тег
, который служит своего рода “кнопкой” для открытия/скрытия информации. Пример:
Как я могу установить приложение?
Для установки нашего приложения, перейдите на страницу "Загрузки" и следуйте инструкциям для вашей операционной системы.
Тег
может иметь атрибут open, который определяет, будет ли содержимое блока отображаться открытым по умолчанию при загрузке страницы и не требовали щелчка пользователя для раскрытия. По умолчанию атрибут open равен false:
Какой-то вопрос
Этот блок с вопросом уже открыт при загрузке страницы.
Теги поддерживаются браузерами на 96,78%:
details & summar
, который служит своего рода “кнопкой” для открытия/скрытия информации. Пример:
Как я могу установить приложение?
Для установки нашего приложения, перейдите на страницу "Загрузки" и следуйте инструкциям для вашей операционной системы.
Тег
может иметь атрибут open, который определяет, будет ли содержимое блока отображаться открытым по умолчанию при загрузке страницы и не требовали щелчка пользователя для раскрытия. По умолчанию атрибут open равен false:
Какой-то вопрос
Этот блок с вопросом уже открыт при загрузке страницы.
Теги поддерживаются браузерами на 96,78%:
details & summar
Как я могу установить приложение?
Для установки нашего приложения, перейдите на страницу "Загрузки" и следуйте инструкциям для вашей операционной системы.
Какой-то вопрос
Этот блок с вопросом уже открыт при загрузке страницы.
Теги поддерживаются браузерами на 96,78%:
details & summar
Добавление WebAuthn в веб-приложение / Хабр | Веб-студия Nat.od.ua
Добавление WebAuthn в веб-приложение / Хабр
Привет! В этой статье мы научимся добавлять WebAuthn в веб‑приложения со стороны frontend‑разработчика. WebAuthn представляет собой новый метод аутентификации, который обеспечивает более высокий уровень безопасности, заменяя устаревшие пароли и SMS‑подтверждения на аутентификацию на основе публичных ключей. Это не только повышает защиту от несанкционированного доступа, но и упрощает вход для пользователей. Например VK и другие компании уже переходят на подобные технологии, отходя от обычных паролей.
Основы публичного шифрования
Для понимания WebAuthn важно знакомство с концепцией публичного шифрования. Это метод, где используются два ключа: публичный и приватный. Публичный ключ можно свободно распространять, и он используется для шифрования сообщений. Шифротекст, полученный таким образом, может быть расшифрован только соответствующим приватным ключом, который должен оставаться в секрете. Эта технология лежит в основе WebAuthn, где публичные ключи обеспечивают надежную аутентификацию без передачи конфиденциальных данных.
Схема работы WebAuthn
WebAuthn
WebAuthn работает на основе нескольких ключевых этапов:
-
Создание вызова (challenge): Сервер генерирует уникальный вызов и отправляет его устройству пользователя.
-
Подтверждение пользователя: Пользователь подтверждает свое намерение аутентифицироваться, используя биометрию, PIN‑код или другой метод.
-
Подпись вызова: Устройство подписывает вызов своим приватным ключом, подтверждая легитимность запроса.
-
Отправка утверждения (assertion): Устройство отправляет подписанный вызов обратно на сайт.
-
Проверка утверждения: Сайт проверяет подпись с помощью ранее сохраненного публичного ключа. Успешная проверка подтверждает аутентификацию пользователя.
Пример реализации в веб-приложении
В этой части статьи мы займемся разработкой простого веб‑приложения, используя React.js. Наше приложение будет включать в себя одно поле для ввода имени пользователя и две функциональные кнопки: ‘Регистрация’ и ‘Вход’.
Регистрация
Для регистрации нового пользователя, нам нужно реализовать функцию, запрашивающую создание новых учетных данных через navigator.credentials.create(). Важный компонент здесь — publicKeyCredentialCreationOptions, который определяет параметры для создания нового ключа. Для более подробного понимания этих параметров, рекомендую ознакомиться с документацией WebAuthn.
// Функция для создания новых учетных данных (credentials) с использованием Web Authentication API.
const getCredential = async ({
challenge, // Хеш (вызов) который получаем от сервера
}) => {
// Опции для создания публичного ключа.
const publicKeyCredentialCreationOptions = {
rp: {
name: ‘my super app’, // имя надежной стороны (Relying Party)
id: ‘webauthn.fancy-app.site’, // идентификатор надежной стороны (Домен)
},
user: {
id: Uint8Array.from(userId, (c) => c.charCodeAt(0)), // преобразование userId в Uint8Array
name: ‘User’, // имя пользователя
displayName: ‘Full username’, // отображаемое имя пользователя
},
challenge: Uint8Array.from(challenge, (c) => c.charCodeAt(0)), // преобразование challenge в Uint8Array
pubKeyCredParams: ,
timeout: 60000, // таймаут ожидания ответа (в миллисекундах)
excludeCredentials: [], // список учетных данных, которые следует исключить
authenticatorSelection: { // критерии выбора аутентификатора
residentKey: ‘preferred’,
requireResidentKey: false,
userVerification: ‘required’, // требование верификации пользователя
},
attestation: ‘none’, // тип аттестации, здесь не требуется
extensions: { // расширения
credProps: true, // если true, возвращаются свойства учетных данных
},
};
// API вызов для создания новых учетных данных с помощью переданных опций.
return await navigator.credentials.create({
publicKey: publicKeyCredentialCreationOptions,
});
};
Эта функция возвращает объект PublicKeyCredential, который в JavaScript представляет собой публичные учетные данные. Они создаются при регистрации через WebAuthn API.
После отправки этих данных на сервер, он проводит проверку публичного ключа и, при успешной верификации, регистрирует отправившего его пользователя
PublicKeyCredential
Аутентификации
Для аутентификации пользователя нам потребуется создать функцию, применяющую navigator.credentials.get(). Эта функция будет использовать параметры publicKeyCredentialRequestOptions, которые должны включать challenge (вызов) и rpId (идентификатор надежного сайта, обычно домен)
const getAssertion = async ({ challenge }) => {
// Создание объекта с параметрами запроса учетных данных (public key credential request options)
const publicKeyCredentialRequestOptions = {
// Преобразование challenge (предоставленного сервером) в Uint8Array.
// Это необходимо, так как WebAuthn требует, чтобы challenge был в бинарном формате.
challenge: Uint8Array.from(challenge, (c) => c.charCodeAt(0)),
// Пустой массив, указывающий, что любые зарегистрированные учетные данные могут быть использованы.
// Можно указать конкретные учетные данные, если требуется ограничить доступ.
allowCredentials: [],
// Идентификатор надежной стороны (Relying Party ID), обычно домен, с которым ассоциирован запрос.
rpId: ‘webauthn.fancy-app.site’,
// Время ожидания в миллисекундах для завершения процесса аутентификации.
timeout: 60000,
// Уровень проверки пользователя. В данном случае требуется подтверждение (‘required’).
// Другие варианты могут включать ‘preferred’ или ‘discouraged’.
userVerification: ‘required’,
};
// Вызов метода get() объекта navigator.credentials с переданными параметрами.
// Этот вызов инициирует процесс получения ассерции аутентификации от пользователя.
return await navigator.credentials.get({
publicKey: publicKeyCredentialRequestOptions,
});
};
Функция будет возвращать объект PublicKeyCredential, который затем нужно отправить на сервер. Это необходимо для процедуры аутентификации и последующего получения токена доступа.
PublicKeyCredential
Демо
Если вы хотите попробовать этот функционал на своем устройстве, воспользуйтесь ссылкой на тестовый стенд. В консоли вы увидите PublicKeyCredential, который используется как для регистрации, так и для аутентификации. Также, для детального изучения кода, предлагаю ссылку GitHub‑репозиторий.
Спасибо за внимание)
PHP и Laravel дайджест новостей за октябрь 2023 года / Хабр | Веб-студия Nat.od.ua
PHP и Laravel дайджест новостей за октябрь 2023 года / Хабр
Всем привет! Краткий обзор новостей из мира PHP и Laravel за октябрь 2023 г.
PHP Дайджест
Вышли PHP 8.1.25 и PHP 8.2.12
В этих выпусках несколько исправлений ошибок и улучшений в модулях Core, CLI, CType, DOM, Fileinfo, Filter, Hash, Intl, MySQLnd, Opcache, PCRE, SimpleXML, Streams, XML и XSL.
Вышел пятый релиз кандидат PHP 8.3.0
Очередной релиз-кандидат вышел в соответствии с графиком. Шестой RC ожидается 9 ноября и станет последним перед финальным релизом PHP 8.3.
Подробный список того, что появится в PHP 8.3, можно найти на сайтах php.watch или stitcher.io.
SjonHortensius/phpshell стал публичным
Репозиторий phpshell, на базе которого работает сайт 3v4l.org стал общедоступен.
Symfony исполнилось 18 лет
18 октября 2005 года был сделан первый публичный коммит проекта Symfony.
Открыта программа раннего доступа PhpStorm 2023.2
В первой версии EAP улучшена поддержка PHP 8.3, добавлен мастер создания новых проектов для Symfony и поддержку преобразования аннотаций Doctrine в атрибуты.
Ядро PHP
Большинство новостей ядра PHP подробно освещаются в серии PHP Core Roundup от PHP Foundation, мы лишь быстро по ним пробежимся:
📣RFC: Rounding Integers as int
На данный момент функции округления round, ceil и floor возвращают число с плавающей точкой, но при использовании целых чисел выше 2^53 получаются неожиданные результаты из-за потери точности. Marc Bennewitz предлагает выполнять округление для заданного целого числа и возвращать полученное целое число, если это возможно.
📣RFC: Unbundle ext/imap, ext/pspell, ext/oci8, and ext/PDO_OCI
Derick Rethans предлагает удалить модули из ядра PHP и перенести в репозиторий PECL.
📣RFC: Multibyte for trim function mb_trim, mb_ltrim and mb_rtrim
Yuya Hamada предлагает добавить многобайтовую поддержку для функций обрезки.
📣RFC: RFC1867 for non-POST HTTP
RFC1867 определяет тип контента multipart/form-data. PHP поддерживает анализ этого типа контента, но только для POST-запросов. Если осуществляется POST-запрос и тип содержимого multipart/form-data, тело запроса немедленно обрабатывается перед запуском PHP-скрипта и заполняется в суперглобальные переменные $_POST и $_FILES. Эта функция запускается автоматически и не предоставляется непосредственно пользователю.
Ilija Tovilo предлагает добавить новую функцию request_parse_body(), чтобы вывести существующую функциональность на пользовательский уровень и использовать ее для других HTTP-методов.
📣RFC: Change the edge case of round()
Saki Takamachi предлагает изменить поведение функции round в крайних случаях и перестать ожидать от чисел с плавающей точкой десятичного поведения и начать ожидать, что числа с плавающей точкой будут вести себя как числа с плавающей точкой.
✅RFC: Increasing the default BCrypt cost
RFC о котором мы говорили в прошлом выпуске принят единогласно. Большинством голосов было принято, что в PHP 8.4 значение cost по умолчанию будет увеличено до 12.
✅RFC: A new JIT implementation based on IR Framework
Ещё один RFC из прошлого выпуска также принят единогласно в обоих голосованиях: в PHP 8.4 появится новая реализация JIT, тем временем старая реализация будет удалена.
Laravel дайджестLaravel дайджестОбновления Laravel
В этом месяце вышло три релиза (10.26 — 10.28). Они большие, но в основном это фиксы — где-то что-то поправили — в док-блоках, в аннотациях и добавили тесты. В Git workflow обновили Git auto-commit action с четвертой на пятую версию.
10.26. Vendor::Publish prompt
Взглянем на поиск в команде vender::publish. Бывает, что в огромном списке нужно выбрать определённую цифру и указать, что именно из vendor service provider необходимо опубликовать. Теперь есть vendor publish с новым Laravel Prompt, где появился поиск. Теперь быстро можно найти что нам требуется и сразу опубликовать все необходимые файлы от vendor service provider. С таким поиском передавать опцию с namespace провайдера больше не надо.
10.26. Route::List -vv option
Прокачали artisan команду Route::list. Появилась опция -vv, которая выведет развёрнутую информацию по применённым к роутам мидлварам.
Artisan.page
Вышел проект по Artisan-командам в Laravel. На нём собраны все Artisan команды и все возможные опции и аргументы которые у них есть. Многих из них нет в официальной документации, а на этом сайте есть! Реализована удобная навигация. Для тех, кто любит быстро и удобно что-то генерировать в одну команду.
Видео версия дайджеста:
Как наложить макет на вёрстку через PerfectPixel / Хабр | Веб-студия Nat.od.ua
Как наложить макет на вёрстку через PerfectPixel / Хабр
Привет! Меня зовут Сергей Криворучко, я работаю наставником на курсе «Фронтенд-разработчик» в Практикуме. Иногда у студентов возникают сложности с PerfectPixel — расширением Chrome, совмещающим макет из Figma с вёрсткой в браузере.
В этом материале я расскажу, как корректно экспортировать макет, установить PerfectPixel, управлять расширением и находить элементы страницы, которые стоит поправить на вёрстке. Для примера взял макет, с которым работают студенты на курсе.
Экспортируем макет из Figma
Откройте нужный макет и выделите его полностью — удостоверьтесь, что в меню слева выделились все разделы страницы, а в окне Preview также видны все элементы.
Переключите Figma в режим разработчика, чтобы посмотреть ширину макета. В нашем примере она составляет 1 440 пикселей.
Удостоверьтесь, что в разделе Export установлен масштаб «1x» и нажмите на Export. Знание ширины макета нам ещё пригодится, поэтому я назвал файл «1440.png».
Устанавливаем PerfectPixel
Установите расширение со страницы в интернет-магазине Chrome. Чтобы PerfectPixel отображался в панели инструментов, нажмите на иконку «Расширения» и активируйте «скрепочку» возле нужного плагина.
Импортируем изображение макета в PerfectPixel
Если вы работаете со страницей, сохранённой на вашем компьютере, то можете получить уведомление о необходимости предоставить доступ к локальным файлам. Для этого перейдите на страницу «Управление расширениями», найдите кнопку «Сведения» у PerfectPixel и установите флажок напротив «Разрешать открывать локальные файлы по ссылкам».
«Глазик» в окне расширения включает и отключает отображение макета на странице. «Замочек» фиксирует его в выбранном положении. А последняя кнопка активирует режим инверсии, в котором макет и вёрстка накладываются друг на друга с помощью вычитания — если они совпадут полностью, получится просто серая картинка.
Откройте расширение и подключите экспортированное изображение по кнопке «Добавьте ваш первый слой». Чтобы совместить макет с вёрсткой, установите масштаб «1.0» в окне расширения.
Перейдите в «Инструменты разработчика», включите мобильный режим и введите ширину — в нашем случае это «1440».
Совместите макет с вёрсткой, перетаскивая его мышью. Более детально настроить положение изображения можно стрелочками в расширении. И не забывайте нажать «замочек», чтобы при скроллинге страницы настройки не сбивались.
Проверяем соответствие вёрстки макету и вносим изменения в код страницы
Возможно, вы увидите некоторые отклонения. Например, в начертании шрифтов или переносе строк. Это нормально, потому что отображение текста в браузере и Figma может различаться, мы этим не управляем.
Но если произошли заметные отклонения, например, в отступах между абзацами, их стоит поправить. Для этого выберите нужный элемент и посмотрите его свойства в «Инструментах разработчика».
В нашем случае неверный отступ появился из-за неотстроенного «гэпа» между блоками текста. Чтобы найти верное значение, нужно подбирать разные варианты (можно увеличивать или уменьшать отступ стрелочками), пока вёрстка и макет не совпадут.
После можно скопировать установленный стиль и перенести его в исходный файл в вашем редакторе.
Как работать с PerfectPixel: видеоинструкция
Если в каких-то моментах инструкция показалась недостаточно наглядной, посмотрите видеоинструкцию — за восемь минут я проделываю тот же путь от экспорта макета до внесения изменений в вёрстку.
Чем отличается синтетическое событие клика от обычного в javascript фреймворках? | Веб-студия Nat.od.ua
Чем отличается синтетическое событие клика от обычного в javascript фреймворках?
Сегодня, стало более ли менее стандартом использование синтетических событий в современных js фреймворках, нежели обычный addEventListener. Но, как же работают эти события? В данной статье, я постараюсь на примере клика в Cample.js версии 3.2.0-beta.1 рассказать об этом.
Прежде всего, когда говорится о работе с событиями, очевидно, что речь заходит о конструкции addEventListener, которая выглядит следующим образом:
element.addEventListener(«событие», «функция», useCapture или options);
Но, так ли это быстро? Как оказалось, это не быстро из-за специфики работы.
Когда речь заходит о фреймворках, важна каждая секунда работы, ведь это в теории тысячи сэкономленных часов использования сайтов или веб-приложений.
Поэтому, нужно было придумать альтернативу, которая заменит такой подход на более быстрый.
Самая банальная идея событий на сайте — что-то выдаёт действие будь то мышка или клавиатура, а javascript вызывает функцию, которая на это событие срабатывает. Тогда, возникает необходимость в двух вещах — обрабатывать событие и где-то его хранить. Но, где?
Если отойти немного назад, то надо вспомнить о том, что DOM элемент является, можно сказать, объектом со своими свойствами. У него есть текст, у него есть следующий элемент и предыдущий и т.д. Так вот, что если функцию хранить в самом элементе (объекте) DOM? Это сразу решает две проблемы: как понять, «на что вызывать функцию?» и «где её хранить?».
То-есть, грубо говоря, как это выглядит:
= функция;Соглашусь, что это выглядит странно, но, если получить элемент через getElementById, к примеру, и вывести его в консоль как объект, то действительно, это будет выглядеть как-то так, что мы присвоили свойство тегу в HTML (понятное дело, что элементу в DOM) со значением функции.
Так вот, остаётся вторая проблема, а как, собственно, обрабатывать событие клика зная, что у нас в DOM элементе есть функция. Это тоже достаточно интересный вопрос, но реализация очевидно будет связанна с addEventListener, потому что этот метод способен обрабатывать события.
Возникает тогда вопрос, а куда его ставить, если на Element в DOM будет медленно? Тут есть тоже достаточно крутое решение. Можно поставить обработку события прямо на документ, а в свойствах принимать target, по которому кликнули. Как это будет выглядеть в теории в javascript:
document.addEventListener(«click», (e)=>…);
Таким образом, есть функция, которая срабатывает, когда кликается на элемент в document, а есть место, куда кликается. Так вот, это место клика как раз может являться объектом DOM, в который было вложено свойство с функцией срабатывания.
К примеру, в Cample.js, обработка будет выглядеть следующим образом:
const newEach = each(«new-each»,
()=>,
`
`
);
Для элемента div с id «el», будет присвоена функция, которая приходит из импортированных данных. Если по документу будет кликнуто мышкой, тогда данная функция будет вызвана.
Примерно так, будет выглядеть синтетическая обработка события клик в современных фреймворках.
Всем большое спасибо за прочтение данной статьи!
PHP и Laravel дайджест новостей за сентябрь 2023 года / Хабр | Веб-студия Nat.od.ua
PHP и Laravel дайджест новостей за сентябрь 2023 года / Хабр
Всем привет! Краткий обзор новостей из мира PHP и Laravel за сентябрь 2023 г.
PHP Дайджест
Вышли PHP 8.1.24 и PHP 8.2.11
Выпуски с исправлениями ошибок вышли по расписанию.
Вышел третий релиз кандидат PHP 8.3.0
Очередной релиз-кандидат вышел по расписанию, до официального выхода PHP 8.3.0, который намечен на 23 ноября, осталось 3 выпуска.
Большинство новостей ядра PHP подробно освещаются в серии PHP Core Roundup от PHP Foundation, мы лишь быстро по ним пробежимся.
📊RFC: Increasing the default BCrypt cost
Tim Düsterhus предлагает увеличить значение параметра const в BCrypt по умолчанию, обозначающего алгоритмическую стоимость, которая должна использоваться, с 10 до 11 (двухкратное увеличение времени) или до 12 (четырехкратное увеличение времени).
📣RFC: DOM HTML5 parsing and serialization
Niels Dossche предлагает добавить в модуль DOM два новых класса: HTMLDocument и XMLDocument.
Класс HTMLDocument добавит поддержку разбора и сериализации HTML5-документов в соответствии со спецификацией. Класс XMLDocument будет служить современной альтернативой классу DOMDocument, который сохраняется для совместимости. Эти новые классы также обеспечат более устойчивый к злоупотреблениям API для загрузки документов.
Существующие классы DOM в глобальном пространстве имен получат псевдоним в новом пространстве имен DOM, так что новая реализация будет использоваться по умолчанию.
📣RFC: A new JIT implementation based on IR Framework
Дмитрий Стогов предлагает новую реализацию Just-in-Time компилятора, основанную на собственном фреймворке Дмитрия Intermediate Representation.
Основной плюс нового подхода в том, что исходный код PHP освободится от низкоуровневых деталей JIT-компиляции. Теперь интерпретатор будет формировать так называемое промежуточное представление, которое вышеупомянутый фреймворк превратит в ассемблерный код с учётом процессорной специфики. Также новый JIT позволит в будущем применить дополнительные оптимизации (видимо, уже на стороне фреймворка) для получения более эффективного машинного кода. Минус же состоит в более долгой JIT-компиляции.
Изначально Дмитрий собирался оставлять обе версии JIT, но, судя по обсуждению в PR, многие не против просто поменять старую на новую и не париться с поддержкой двух компиляторов.
❌RFC: Support optional suffix parameter in tempnam
RFC о котором мы говорили в прошлом выпуске был отклонен.
Основная проблема – суффикс не будет работать в Windows. Чтобы избежать больших проблем из-за незначительного изменения, многие проголосовали против.
Вышел CakePHP 5
Команда CakePHP выпустила пятую версию фреймворка, которая была в разработке последние два года. Теперь для работы требуется PHP 8.1 и выше, улучшены подсказки по всему фреймворку. CakePHP теперь использует объединения типов для формализации типов многих параметров во всей платформе, обновлён PHPUnit до 10 версии, новая поддержка сопоставления перечисления типов в ORM, обеспечивающая более выразительные слои модели с улучшенной проверкой типов, добавлена поддержка HTTP-фабрик PSR17 и многое другое.
State of Laravel 2023
Исследование по Laravel, о котором мы говорили в прошлом выпуске завершилось. Более 4000 разработчиков приняло участие в этом году. Уменьшилась доля людей, которые считают, что Laravel фреймворк движется в правильном направлении с 49% до 41%. Напишите в комментариях, как считаете вы?
Пакет enum-concern от Emre Yarligan
PHP-пакет для удобной работы с перечислениями с помощью Laravel Collections.
Пакет включает зависимость от Collections, поэтому его можно использовать не только в Laravel проектах.
Пакет act от Casey Lee
Пакет позволяет запускать GitHub Actions локально!
Это может быть полезно для отладки скриптов, не делая множество коммитов на GitHub и ожидая их выполнения.
Когда вы запускаете act, он считывает GitHub Actions из папки workflows и определяет набор действий, которые необходимо выполнить. Используя Docker API для извлечения или создания необходимых образов, как определено в файлах workflow, и, наконец, определяет путь выполнения на основе определенных зависимостей.
Получив путь выполнения, он использует Docker API для запуска контейнеров для каждого действия на основе ранее подготовленных образов. Переменные среды и файловая система настроены в соответствии с тем, что предоставляет GitHub.
PhpStorm Public Roadmap: What’s Coming in 2023.3
Что ожидать в PhpStorm 2023.3?
Команда PhpStorm добавит комплексную поддержку PHP 8.3, возможность исключать каталоги и файлы внешних библиотек для ускорения индексации, специальную стилизацию типов в дженериках.
Для Symfony разработчиков будет полезным мастер создания нового проекта, преобразование аннотаций Doctrine в атрибуты, а также поддержка Doctrine Query Language внутри QueryBuilder.
Voices
Плагин для продуктов JetBrains Voices позволяет комментировать код голосовыми сообщениями.
Напишите в комментариях как вы относитесь к такой идее?
Flappyphpant
И напоследок давайте посмотрим простую игру, похожую на Flappy Bird, написанную на PHP, построенная на PHP-GLFW и фреймворке VISU.
Далее посмотрим что произошло в этом месяце в Laravel.
Laravel дайджестMoonShine v.2.0 alpha
Вышла MoonShine v.2.0 alpha — open-source админ панель для Laravel. Что нового — читайте в этой статье.
Обновления Laravel10.22. Testing methods for Precognition
PR от Peter Fox, который добавляет нам сахара в процесс тестирования precognition запросов. У нас появился удобный метод usingPrecognition, чтобы сразу отправить нужные заголовки. Также появился метод который проверит в ответе нужные заголовки.
10.22. Добавление поддержки Enum в правила валидации In и NotIn
Следующий PR добавил поддержку Enum в правила валидации In и NotIn. Теперь мы с вами можем использовать также и кейсы из Enum.
10.23. Команда make:view
PR, который судя по описанию очень долго ждали — это artisan команда которая создает view. Скажите а ждали ли вы эту команду? Лично я не особо. Но в целом у нас есть команда которая теперь создает view, располагает ее в директории и появилась также опция –test, которая заодно создаст и дополнительно тесты — правильно у нас это view рендерится.
Ну и раз у нас PR от Nuno Maduro, также и опция –pest, которая сгенерирует Pest тесты.
10.23. Поддержка PHPredis 6.0
Небольшом PR, который добавляет поддержку PHP redis версии 6.0.
10.23. Before/After database truncation methods
PR, который добавляет новые ивенты в тесты на отслеживание событий до того как у нас происходит очистка базы данных и соответственно после.
10.23. Команда Make:Model с опцией Test
Немного прокачали команду Make:Model с опцией Test. До этого, когда мы ее с вами выполняли у нас создавался тестовый файл featureModels, но не было при этом тестового файла для контроллера, хотя в опции мы могли указать что также нам нужен контроллер. Теперь тестовый файл для контроллера создается.
10.24. Метод Str::position()
Затрагивает класс по работе со строками и новый сахарный метод Position над нативным mb_strpos. Но я думаю здесь и так все понятно — ищем позицию указанной строки в строке.
10.25. Метод String Take()
Снова класс по работе со строками и снова сахар, но в целом в рамках этого класса другого мы не ожидаем. Чтобы из указанной строки получить только количество символов которые мы передаем в метод Take. В общем сахар над сахаром Str::substring, где соответственно сам substring это сахар над нативным substr.
10.25. Throttle Exception
PR от Tim McDonald, который добавляет новый метод в errorHandler класс в Laravel. Для нашего удобства чтобы отделить Exception от ratelimit и уже далее с ними взаимодействовать, делать репорт и все что угодно.
Видео версия дайджеста:
Как коридорное исследование помогло обновить каунтеры тредов в мессенджере | Веб-студия Nat.od.ua
Как коридорное исследование помогло обновить каунтеры тредов в мессенджере
Треды — это комментарии под сообщениями. Они помогают сделать общение структурным: вместо потока идущих подряд сообщений можно создавать тематические ветки обсуждений. Но как пользователю сориентироваться, в каких тредах появились новые комментарии, а в каких нет? Сначала мы использовали иконку-каунтер, которая меняла цвет в зависимости от новых событий, но потом стало понятно, что ее нужно менять.
Привет! Меня зовут Олег Борискин, я продакт-менеджер в команде We.Teams. Мы разрабатываем корпоративный мессенджер внутри Webinar Group. В статье расскажу, как исследование на небольшой группе респондентов помогло переосмыслить отображение счетчика новых комментариев в треде.
Как работал счетчик сообщений в треде раньше
Когда мы начали разработку, то сразу заложили в мессенджер возможность оставлять комментарии под сообщениями. Иконка треда выглядела как счетчик с количеством всех комментариев.
За обновлениями помогал следить раздел «Обсуждения», который агрегировал все комментарии в хронологическом порядке. Такое решение позволяло не просматривать чаты в поисках обновлений, а обращаться к одной вкладке и отвечать оттуда.
We.Teams разрабатывается поэтапно: сначала мы сделали треды, а затем начали прорабатывать реакции. В этот момент поняли, что реакции конфликтуют с тредами: и там, и там была схожая форма компонентов. Нужно было отказаться от прошлой визуализации новых комментариев и придумать новую.
Из-за того что мы решили отказаться от таблетки, нам критически было важно донести до пользователя факт наличия нового комментария. Раньше таблетка подсвечивалась фиолетовым, но если ее убрать, то становилось непонятно, как подсвечивать: точкой, цветом, новой строкой с состоянием?
Это всё стало поводом для обсуждений, и мы накидали вариантов, которые нужно было протестировать. Когда решение не очевидно, а значимых аргументов в пользу единственного варианта ни у кого нет, то самый лучший выход — это провести исследование.
Создаем прототипы и зовем людей на тест
Мы решили устроить коридорный тест: собрать небольшую группу людей из компании и попросить их выбрать наиболее информативный макет. Метод простой, но эффективный для быстрой проверки гипотезы и выбора одного варианта из множества.
Мы пригласили респондентов из разных отделов компании: аккаунта, дизайнера, сейлза, разработчика и лида. Мы специально взяли разных специалистов — так модель поведения разработчика в мессенджере будет сильно отличаться от сейлза: последнего будут заметно чаще тегать. В итоге маленькая выборка позволяет диверсифицировать опыт по каждой группе. Да, для продактов и UX-исследований это, возможно, очевидный поинт, но мне кажется, лишний раз стоило его упомянуть 🙂
Задание для респондентов сформулировали так: посмотрите ленту и определите, где нужен ваш ответ. Ориентируясь только на интерфейс, людям нужно было понять, на каком сообщении сфокусироваться.
Как выглядел макет для тестирования
В конце исследования, кроме вопросов в стиле «всё ли было понятно?», мы ввели еще два: оценки эстетики и удобства. Подобные опросы помогают посмотреть на задачу шире и получить общий фидбэк.
В результате лидером по удобству и восприятию оказался вариант с общим количеством комментариев и счетчиком новых.
Исследование не только помогло понять, как лучше отображать каунтер, но и позволило взглянуть на проблему под другим углом.
Восприятие цвета сильно зависит не только от монитора, но и человека. На каких-то устройствах он был слишком тусклым, а люди по-разному воспринимали оттенок цвета. Поэтому ориентироваться только на цвет при уведомлении о новых сообщениях оказалось недостаточно.
Подсветка перегружает интерфейс. Фоновая цветная подложка помогала выделить каунтер, и многим респондентам показалась заметной, но на практике создавала визуальный шум. Если в ленте чата будет десяток таких сообщений, то они будут выглядеть громоздко.
Коридорное исследование помогло нам сразу понять, какая визуализация будет предпочтительней для пользователей. Естественно, когда мессенджер выйдет в публичный доступ, мы будем собирать обратную связь дальше и смотреть. Но зато на этом этапе нам уже удалось сделать пусть и небольшое, но важное изменение, которое улучшит пользовательский опыт от использования мессенджера.
Как теперь работает новый каунтер
Мы оставили логику работы старого каунтера и добавили к нему новый статус — количество непрочитанных комментариев. Если комментариев нет, то показываем только общее число.
Мы дополнили отображение уголком, который позволяет визуально разделять треды и сообщения. Еще этот элемент показывает, что перед пользователем не просто текст, а иерархический элемент интерфейса, по которому можно кликнуть и открыть тред.
Как я уже рассказывал в посте про логику уведомлений, мы продолжаем следовать курсу показывать только то, что относится к пользователю. Мы подсвечиваем новые комментарии только тогда, когда произошло событие, чтобы не засорять ленту рядами фиолетовых каунтеров. Например, в чате есть сотня новых сообщений — подсвечиваться будут только те, где произошло важное для пользователя событие: его упомянули, написали под его тредом или он ранее сам написал в треде.
Кнопка отключения уведомления поможет отписаться от треда, если человек больше не хочет участвовать в обсуждении. Например, он сообщил, что придет на корпоратив и дальше его не интересует обсуждение деталей 🙂
Также мы изменил каунтер для раздела «Обсуждения»: теперь он показывает не общее количество комментариев, а число обсуждений, где произошли события. Так становится проще следить за обсуждениями: пользователь теперь видит число диалогов, а не сообщений. При переходе открывается список диалогов с обновленными каунтерами под сообщениями, что тоже вносит больше порядка в общение.
Напоследок
Если вы в команде не знаете, как и что реализовать, то вы проводите исследования и слушаете пользователей. Как было у нас: столкнулись с проблемой, родилась гипотеза, а тест помог не только выбрать нужный вариант, но и получит ответ, почему другие макеты были не очень удобными.
Поэтому важно ориентироваться не только на собственную экспертность, но и мнение пользователей. Даже такая небольшая вещь, как каунтер, может быть важным элементом интерфейса: представьте человека, который каждый день следит за десятком тредов, и плохая информативность начинает вызывать у него раздражение. Такие небольшие исследования помогают проработать задачу и получить фидбэк до того, как это попадет в прод.
Методы хэширования паролей. Долгий путь после bcrypt / Хабр | Веб-студия Nat.od.ua
Методы хэширования паролей. Долгий путь после bcrypt / Хабр
Шифровальная машина M-209, на основе которой создана первая в истории функция хэширования crypt в Unix
Прошло 25 лет с момента изобретения алгоритма хэширования bcrypt (1997), но он до сих пор считается одним из самых стойких к брутфорсу хэшей.
Вот уже несколько десятилетий некоторые специалисты прогнозируют, что аутентификация будет производиться ключами/сертификатами. Но этого до сих пор не случилось. Пароли остаются неотъемлемой частью систем информационной безопасности. Вообще, они широко использовались ещё до изобретения компьютеров, так что в таком долгожительстве нет ничего удивительного.
Если посмотреть в историю, то концепция компьютерных паролей возникла на заре многопользовательских вычислительных систем, когда потребовался способ аутентификации и защиты данных. В Массачусетском технологическом институте в 1960-е разработали систему Compatible Time-Sharing System (CTSS) с парольной аутентификацией аккаунтов, одну из первых в мире таких систем. Любопытно, что это произошло несмотря на упорные возражения Ричарда Столлмана, который пытался противостоять введению паролей в MIT в 1970-е. Об этом вспоминал Стивен Леви в документальной книге «Хакеры: герои компьютерной революции».
Однако истинные истоки современной парольной защиты можно отнести к разработке Unix и её нативной функции хэширования crypt. Первоначальная версия crypt в Unix (6th Edition) была реализована Робертом Моррисом и базировалась на шифровальной машине Хагелина (модель M-209).
Конвертер M-209B Бориса Хагелина
О легендарном изобретателе шифровальных машин Борисе Хагелине рассказывали на Хабре. Родившийся в Российской империи, этот мальчик отучился в Баку, а отправился на дальнейшую учёбу за границу, где и стал знаменитым благодаря созданию уникальных шифровальных машин и основанию швейцарской компании Crypto AG в 1952-м, в течение десятилетий мирового лидера на рынке криптографических устройств.
Возвращаясь к Unix, специалисты ещё в 70-е годы осознавали проблему слишком быстрого выполнения функции crypt. В Unix (7-я редакция) функция была усовершенствована путём введения 12-битной соли и итерации шифра Data Encryption Standard (DES) для хэширования пароля. В результате использования соли получилось семейство из 2¹² различных хэш-функций, и каждый пользователь случайным образом выбирал из этого семейства свой пароль. Цель использования соли заключалась не только в том, чтобы обеспечить уникальность хэшей даже для одинаковых паролей, но и в том, чтобы существенно затруднить атаки с предварительным вычислением хэша. Хэшированный пароль с солью хранился в файле паролей, что позволяло системе аутентифицировать пользователей, не храня пароли в открытом виде.
Для своего времени crypt считался безопасным, однако развитие вычислительных мощностей и экспортные ограничения на криптографию в США открыли дорогу новым алгоритмам хеширования паролей, таким как MD5crypt (1994).
Запрещённый к экспорту из США код RSA распечатан на футболке в знак протеста против ограничения свободы слова. Одетый таким образом гражданин имел право выехать за границу и показать футболку иностранным гражданам
Опасения по поводу безопасности новых алгоритмов привели к разработке bcrypt в 1997 году. В нём впервые реализовали концепцию адаптивного хеширования, благодаря которой атаки методом брутфорса и по словарю стали вычислительно более сложными (алгоритм защищён от будущего роста производительности оборудования). С момента своего появления в июне 1997 года в составе OpenBSD 2.1 и публикации в USENIX в 1999 году bcrypt оказал глубокое влияние на индустрию безопасности.
Оригинальная научная статья с описанием bcrypt (1999)
В целом четверть века развития функций хэширования и индустрии брутфорса можно изобразить в такой таблице:
Сравнение функций хэширования и их безопасности. Адаптируемый коэффициент (work factor) означает, что нагрузку на CPU можно увеличить. Вычисления с расходом памяти (memory-hardness) означает, что кроме CPU алгоритм хеширования масштабируется и по памятиПроизводительность брутфорса
За последние 30 лет технологии взлома паролей и аппаратное обеспечение значительно эволюционировали. Мощность брутфорса сильно увеличилась. Стало очевидно, что нужно адаптировать алгоритмы хеширования паролей по стоимости работы. То есть сам алгоритм должен быть спроектирован таким образом, чтобы сделать нерентабельным брутфорс на современном оборудовании, а ещё лучше — с запасом прочности на годы вперёд.
Чтобы продемонстрировать этот прогресс, вот примерные оценки скорости брутфорса на компьютерах разных лет, а также в разных программах (Hashcat и John the Ripper). Следует иметь в виду, что эти цифры просто демонстрируют общий тренд, их нельзя напрямую сопоставлять из-за различий в оборудовании и ПО. Для наглядности цифры публикуются со всеми разрядами, без сокращения до «млн» и «млрд».
Можно заметить, что с годами растёт не только сложность алгоритмов, но и производительность железа, а также эффективность специализированных программ.
Например, за 34 года скорость перебора хэшей des-crypt выросла с 45 штук до 6,3 млрд в секунду.
В то же время старый bcrypt остаётся одним из самых сложных для взлома хэшей, особенно с максимальным коэффициентом сложности (work factor). Хотя формально он считается устаревшим, но на практике теоретически вполне пригоден к использованию, наряду с более современными, стойкими к брутфорсу алгоритмами scrypt и Argon2.
Пароли навсегда
Что будет дальше?
Современные алгоритмы хеширования очень сильно снижают эффективность брутфорса. Но утечки хэшей по-прежнему представляют собой постоянную угрозу. С другой стороны, появление многофакторной аутентификации (MFA) сместило акцент на защиту учётных записей пользователей с помощью дополнительных уровней проверки, в результате чего пароли стали менее важны для безопасности.
В современном мире всё большее распространение получают облачные сервисы, где большинство важных данных хранится удалённо. Простой брутфорс малоэффективен для проникновения в такие системы, поэтому злоумышленники, как правило, используют уязвимости или социальную инженерию.
Спустя четверть века люди до сих пор полагаются на пароли как основной метод защиты компьютерной информации. С каждым годом растёт их сложность (энтропия), вводятся более сложные методы хэширования, но сами текстовые пароли/фразы остаются.
