Веб-разработка *

Как инициализировать контекст исполнения?

Об этом веб-разработчик Василий Новиков рассказывает в новой серии нашего открытого курса по JavaScript. Из десятой серии вы узнаете про:

• три вида записей окружения: LexicalEnvironment, VariableEnvironment и PrivateEnvironment;

• шаги каждого из четырех алгоритмов контекста исполнения;

• инициализацию глобального контекста исполнения.

Больше информации о сериях, а также полезных материалах к ним можно найти на сайте курса JS.

Подписывайтесь на канал AvitoTech в Telegram, там мы рассказываем больше о профессиональном опыте наших инженеров, проектах и работе в Авито, а также анонсируем митапы и статьи.

Как защититься от самых популярных кибератак: советы экспертов из крупных компаний

Масштабы киберугроз в России растут: только за 9 месяцев 2024 года зафиксировано более 100 утечек данных. Атаки злоумышленников становятся всё более изощренными. Но есть конкретные шаги, которые помогут уберечь ценные данные и выстроить верную защиту ваших систем.

В новой статье на New Retail эксперты из OZON, F.A.C.С.T, Flowwow и AGIMA рассказали о самых типичных схемах мошенников и методах борьбы с ними. Вот главные тезисы:

📌Атакуют всех: злоумышленники используют старые утечки данных, анализируют оборот компаний и шифруют ценные данные для выкупа. Группировка Conti, к примеру, требует до 4% оборота за расшифровку.

📌 Security by Design. Это принцип разработки, при котором безопасность системы закладывается еще на этапе планирования архитектуры. Он помогает исключить уязвимости и защитить продукт еще до запуска.

📌 Фишинг — одна из главных угроз. Имитация фишинговых атак и проведение тестов на проникновение (пентестов) помогут подготовить команду к реальным угрозам. Строго проверяйте отправителей во входящих письмах и заведите правило не переходить по подозрительным ссылкам.

📌 Автоматизация мониторинга. ИИ-решения и системы автоматической обработки угроз помогут быстро выявлять аномалии и реагировать на них за считаные минуты вместо часов.

Эти и другие советы из статьи помогут защитить корпоративную инфраструктуру и данные, минимизировать риски утечек и сохранить репутацию вашей компании.

Всё чаще слышно про подключение ИИ к процессу код-ревью. Звучит круто, но есть нюансы.

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

Кроме того, AI смотрит только на код в текущем PR, не понимая ни архитектуры проекта, ни бизнес-требований. В итоге выдает технически правильные, но часто бесполезные рекомендации. Особенно это заметно в крупных проектах, где каждое изменение влияет на кучу связанных компонентов. Где есть "исторически сложившееся"

Код-ревью — это не только поиск багов. Это обмен опытом и обсуждение подходов. AI не может понять, подходит ли решение для конкретной команды, насколько оно масштабируемо и как впишется в существующую кодовую базу.

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

Поэтому AI в код-ревью лучше использовать как доп помощника - базовые проверки и очевидные ошибки. А разработчики-люди всё еще нужны для работы с пониманием контекста.

Приглашаю всех подписаться на мой канал https://t.me/crossjoin

После внедрения GDPR количество трекеров на сайтах издателей как из ЕС, так и за его пределами возросло, однако для издателей из ЕС рост оказался значительно меньше. Таким образом, GDPR достигла своей цели, сократив количество трекеров на 14,79% по сравнению с ожиданиями без регулирования.

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

Оркестрация с помощью Temporal: как это устроено и как применять на практике — Антон Цитульский / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

В современном мире, где скорость и непредсказуемость становятся новым стандартом, обеспечение надежности бизнес-процессов приобретает критическое значение, особенно в индустрии FoodTech. В Uzum Tezkor команда разработки применяет технологию Temporal для гарантии бесперебойной работы всех заказов. В докладе будет продемонстрировано, как Temporal становится надежным инструментом в оркестрации и обеспечении устойчивости процессов, обеспечивая точное выполнение каждого заказа.

Антон подробно рассказал о работе Temporal, начиная с архитектуры кластера и заканчивая внедрением конкретных бизнес-процессов. Особое внимание уделил детерминизму, версионированию в Temporal, а также использованию gRPC для взаимодействия. И показал, как механизм Event History в Temporal способствует достижению отказоустойчивости, позволяя контролировать каждый аспект процесса и предотвращать потерю заказов.

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

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/tQchSie

Совет по Joomla: используем Promise в Ajax-запросах

В статье Ajax-запросы нативными средствами Joomla было подробно разобрано, как с помощью Joomla.request можно легко создавать Ajax-запросы в Joomla.

В одном из комментариев был вопрос по поводу Promise, а умеет ли Joomla? Умеет, но начиная с Joomla 4. Достаточно при создании запроса выставить флаг promise в true и результатом выполнения запроса будет Promise:

Joomla.request({
    url: Joomla.getOptions('system.paths', '').root+'/index.php?option=com_ajax&format=json&module=example',
    method: 'POST',
    promise: true
})
.then(response => {
    let text = JSON.parse(response.text);
    return text.data;
})
.catch(error => {
    console.log(error);
});

Таким образом мы можем эффективно строить асинхронные цепочки, добавив всего один флаг к вызову Joomla.request.

Трассировка микросервисов или когда метрик и логов недостаточно — Руслан Гайнанов / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

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

Спикер рассказал, что необходимо для запуска систем трассировок на базе open-source решений, показал на простых примерах как настроить сбор трейсов с микросервисов на Python (fastapi, SQLAlchemy, httpx), как потом работать с трейсами и какую полезную информацию можно извлечь.

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/MHEIxt

Frontend Fortified: как стать неприступным для атак — Зар Захаров / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

Стратегии и практики безопасности для Frontend-разработчиков. В докладе Зар рассмотрел основные угрозы в мире frontend, обсудил ключевые аспекты безопасности при разработке web-приложений, включая защиту от XSS, CSRF и других угроз. А также способы их предотвращения.

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/GZeAy

50 оттенков кеширования: от in memory к многоуровневому redis-кластеру — Леонид Ченский / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

При разработке команда логистики часто сталкивалась с высокими нагрузками в несколько сотен тысяч rps и очень жесткими SLO времени ответа. При этом с каждым годом менялись функциональные и нефункциональные требования. В выступлении спикер рассказал, как в команде боролись с такими нагрузками, а также о том, с какими трудностями пришлось столкнуться, и какие ошибки допустили.

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

Итерация 1: in memory cache.

Итерация 2: удаленный шардированный кэш-кластер (redis vs memmcached).

Итерация 3: N-уровневый кэш.

Итерация 4: шардированно-реплицированный multi-DC кэш-кластер Redis.

В конце выступления спикер подвел итог и поговорил об альтернативах KV.

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/2ik4N

Контекст исполнения: что это и какие виды бывают?

В девятом выпуске нашего открытого курса по JavaScript вместе с веб-разработчиком Василием Новиковым подробно разбираем Execution Context — контекст исполнения.

Из нового выпуска вы узнаете:

• как объяснить Execution Context простым языком;

• какие бывают виды контекста исполнения;

• каким образом реализуется концепция Environment Record.

Подписывайтесь на канал AvitoTech в Telegram, там мы рассказываем больше о профессиональном опыте наших инженеров, проектах и работе в Авито, а также анонсируем митапы и статьи.

AGIMA — российский интегратор цифровых решений, один из лидеров в сфере веб- и мобильной разработки по версии Tagline и RUWARD. Среди клиентов — АльфаСтрахование, Мегафон, Росбанк, World Class, Магнит и др.

Компания искала новое облако с выделенным инфраструктурным кластером, широкими каналами связи и большими ресурсами для моментального масштабирования.

За 2 месяца AGIMA развернула у нас 100 виртуальных машин с управлением через Proxmox Cluster, внутри которых размещаются DWH, Jira Dev, Keycloak, Sentry, GitLab Runner и другие внутренние сервисы.

О том, как это удалось, читайте в кейсе → 

От чего на самом деле зависит скорость загрузки сайта

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

Между тем неосторожно отмечу, что самое узкое место при загрузке сайта — скорость интернет соединения. Это логично до безобразия, не так ли? Загружались бы со скоростью в гигабайт в секунду — не было бы смысла корячиться с методами загрузки, работой с кэшем и подстраивать под это архитектуру.

Можно годами спорить о том, какой метод позволит быстрее загружать в каждом отдельно взятом случае, да оно и верно — не сидеть же сложа руки! Да и кривые оные поломают любое решение. Но на самом деле самую крупную работу в этом плане делаем вовсе не мы, рядовые, а те, кто может, например, поднять среднюю скорость интернет соединения раз в 5–10 по стране. Это не чудо, а новые технологии и оптимизации на глубоком уровне (вспомните, как развивался HTTP и WiFi).

Оптимизация — дело правое, но на нашем уровне — весьма незначительное.

Привет, друзья! 👋

Наткнулся на интересное видео со сравнением Filament и нашего MoonShine! 🎥

https://www.youtube.com/watch?v=HOQZi8E_ED8

Всегда интересно посмотреть на свой продукт глазами других разработчиков. Особенно когда это честное сравнение, без попытки кого-то выделить или принизить. Автор очень детально разобрал оба пакета, и что меня особенно порадовало — отметил именно те моменты, на которые мы делали упор при разработке MoonShine.

Главный вывод автора — ключевое различие между пакетами в использовании Livewire. И тут я полностью согласен! Мы специально отказались от Livewire в MoonShine, чтобы добиться максимальной производительности. Например, при работе с модальными окнами мы делаем всего один запрос при первом открытии, а дальше работаем с кешированными данными.

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

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

Есть специалисты по Filamet? Давайте обсудим 💬

Готовы вывести свои веб-приложения на новый уровень? 💻

Тогда новый бесплатный курс «Веб-разработка на практике» — для вас!

Внутри — подробные инструкции о разработке и деплое проектов с реальными примерами, а также полезные советы для начинающих веб-разработчиков. Изучение займет меньше часа. После прохождения вы научитесь создавать веб-приложения, работать с API, автоматизировать процессы и деплоить проекты. 

В рамках курса

🔹Разрабатываем и разворачиваем приложение на FastAPI . 

🔹Разбираемся, как написать Docker-файл и настроить конфигурацию nginx, чтобы задеплоить веб-приложение.

🔹Показываем, как создать и настроить мини-приложение ВКонтакте для отслеживания погоды, а после — задеплоить на облачный сервер.

Переходите в Академию Selectel, чтобы ознакомиться со всеми материалами! 

gRPC-стримы на практике: к чему готовиться и где применять — Сергей Антоничев / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

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

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/ZrQZZi

Проблемы конфигурирования frontend-приложений — Александр Широчкин / Ural Digital Weekend 2024

Как frontend-приложения получают конфигурации? Об этом в докладе рассказал Александр. А также он разобрал, почему "нельзя просто так взять и зачитать из env". Помог понять, почему не стоит подключать js с параметрами на этапе деплоя или модифицировать index.html. А также узнать, почему не стоит использовать деплой-скрипты с заменой шаблонных параметров в коде. Познакомил с решениями, которые одобрят самые матёрые спецы по инфобезу.

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/0LPN6

Kubernetes «на сковородке». Простые советы и сложные рецепты — Игорь Титов / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

Kubernetes для всех. Простые советы и сложные рецепты. Экосистема Kubernetes.

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/VKYkri

Сайт, готовый ко всему — Никита Дубко / Ural Digital Weekend 2024

Опубликовали запись доклада секции «Разработка» с Ural Digital Weekend 2024.

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

В докладе вы найдете множество интересных примеров и отсылок. Заходите посмотреть!

Ссылка на запись доклада в ВКонтакте.

Ссылка на презентацию: https://goo.su/NRS

Что необходимо учесть при поднятии переменных?

В новой серии нашего открытого курса по JavaScript вместе с веб-разработчиком Василием Новиковым разбираем поднятие переменных как один из этапов выполнения кода.

Из нового выпуска вы узнаете:

• что такое поднятие переменных; 

• три ключевых слова: как объявлять переменные в JavaScript;

• два вида типизаций и условия их определения.

Не забывайте заглядывать в описание к видео — там ссылки на полезные материалы по теме.

Подписывайтесь на канал AvitoTech в Telegram, там мы рассказываем больше о профессиональном опыте наших инженеров, проектах и работе в Авито, а также анонсируем митапы и статьи.

Если у вас в Vite проекте есть данные в json файлах, то иногда удобней работать с json5 (+комментарии и переносы строк, как минимум)

Для этого надо:

1. Поставить Vite плагин vite-plugin-json5

2. Поставить расширение json5 для VS Code для подсветки синтаксиса

3. Чтобы не ругался TypeScript, прописать в index.d.ts:

declare module "*.json5" {
  const value: any;
  export default value;
}

Стало намного удобней.

Бандл не меняется.