Фронтенд

Привет, Хабр! Меня зовут Дмитрий Ханин, я работаю в Сбере и участвую в разработке Платформы ЦА — системы на базе блокчейн, занимающейся привлечением средств юридических и физических лиц. Сегодня хотелось бы рассказать про тот путь, который мы прошли за несколько лет, как организовали взаимодействие между разными приложениями и чем нам это помогло.

Рассказ разделён на две части. В первой рассмотрим путь проекта и проблемы, с которыми сталкивались, а во второй разберём, как мы решали часть этих проблем.

Скорость загрузки страниц — один из ключевых факторов, влияющих на успех сайта в интернете. Она влияет на пользовательский опыт, конверсию и SEO. Google учло это уже в 2010 году, сделав скорость загрузки фактором ранжирования. В 2018 году метрики были расширены, а в 2020 — дополнены новыми обновлениями.

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

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

Web Vitals — набор метрик от Google, которые показывают, насколько быстро и стабильно загружается ваш сайт, как плавно отображается контент и насколько оперативно интерфейс реагирует на действия пользователя.

В этой статье вы найдёте пошаговую инструкцию по интеграции Web Vitals в проект, отправке метрик в Яндекс.Метрику и настройке отчётов для оперативного мониторинга. Благодаря этому вы сможете своевременно выявлять и устранять «узкие места» в работе приложения ещё до появления жалоб пользователей.

Привет, с вами снова я – Дмитрий, React-разработчик, хотелось бы сегодня затронуть тему среды выполнения JS. Многие знают, другие уже подзабыли, а новички — вовсе не в курсе. В общем, эта статья точно найдёт своих читателей. Постараюсь простыми словами и по делу.

Введение в любой фреймвок начинается с написания одного простого компонента. Чаще всего этим компонентом будет "счетчик нажатий". Это своеобразный "hello world" в мире фронтенд разработки. Именно поэтому я и возьму его за основу данного материала.

Не так давно мы успешно портировали проект CryptoTradingFramework на Avalonia UI с использованием библиотеки визуальных контролов EMX Controls. На примере клиентского приложения CryptoMarketClient мы хотели бы рассказать о возможностях библиотеки EMX Controls для разработки GUI для финансовых приложений.

Несколько месяцев назад я написал статью — «Observable — удобный state‑manager», что было скорее заметкой, и за что мне здорово досталось в комментариях! Уважаемым комментаторам — спасибо, я постарался учесть все замечания.

Сегодня представляю вам kr‑observable 2.0 — библиотеку для реактивного программирования на JavaScript. И удобный state-manager тоже.

Грандиозная история вокруг микро open-source проекта который неожиданно выстрелил и вытащил меня из ямы

Асинхронность в JavaScript, где и как использовать в web разработке на frontend и backend. Цепочка промисов и их параллельные выполнение.

В первой и второй частях нашего гайда мы — техлид backend-команды Rustore Григорий Рябов и руководитель команды разработки RuStore: направление платежей Александр Котельников, прошлись по всем подготовительным этапам — от Kick-off до разработки и тестирования.

После выхода первой версии плагина я решил сразу сесть за реализацию roadmap

Новая версия vite-plugin-create — это не просто багфиксы, а большой шаг в сторону реальной кастомизации. Теперь ты сам определяешь, что ты хочешь генерировать, как называть, какие шаблоны использовать — и всё это максимально просто.

Примечание переводчика. Оригинальная статья была опубликована в 2012 году. Соответственно, актуальность статьи и практическая применимость для современной разработки ставится некоторыми разработчиками под сомнение. В то же время, если, по какой-то причине, вам необходимо ознакомиться с MVC и MVP, данная статья может быть полезна.

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

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

В этом разделе мы рассмотрим два популярных шаблона – MVC и MVP. Контекст нашего исследования будет заключаться в том, как эти шаблоны связаны с популярным фреймворком JavaScript Backbone.js, который будет рассмотрен более детально позже.

Решил написать простенькую статейку по следам реализации небольшой программки на С++ под Виндоус, которая содержит в себе TCP сервер. Мы получаем от клиента http запрос. Соединение не защищенное.

На чем реализован клиент нам неизвестно: может на php (curl,socket,stream_contex_create,...), может на js (ajax), вообще может быть на чем угодно.

Надо задача реализовать http парсинг запроса и контента, выполнить задание (на каком-то подключенном к серверу оборудовании) и ответить клиенту о результате.

Примечание: автор реализует http сервер на устаревшем Qt4, используем QTcpServer. Но для http сервера это не принципиально.

Вы уже встречались с этими "веселыми" историями, когда разработчик заканчивает работу над задачей, она проходит тестирование, отправляется в прод, а там встречается неожиданным отказом какого-нибудь мелкого метода api и укладывает всё приложение так, что пользователи наблюдают только белый экран?

Я в своё время познакомился с ними чересчур близко... И, честно сказать, потоки RxJs прекрасные учителя - тебе не захочется снова повторять их уроки. Чему же они нас учат? В первую очередь тому, что не стоит доверять внешним источникам; вы не контролируете ни соединение с сервером, ни api-сервис, а значит не имеете никаких оснований слепо доверять им и ожидать безотказной работы.

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

У меня есть несколько персональных пет-проектов, где я тестирую различные технологии, сервисы и библиотеки или упрощаю собственную жизнь (например, персональный трекер с единственным пользователем — мной). Иногда хочется захостить эти проекты за пределами личного ноутбука, а еще лучше если есть возможность прикрутить собственный домен, чтобы можно было делиться с другими людьми. Так как все это абсолютно не коммерческие истории, то платить деньги за хостинг не очень хочется. Раньше для таких целей я пользовался Heroku, но еще несколько лет назад они закрыли бесплатный тариф. В очередной раз столкнувшись с желанием захостить свой проект я решил изучить вопрос.

Найденные варианты я собрал в табличку, актуальную на май 2025. ChatGPT o3 наврал в ответах, поэтому пришлось добавлять, фильтровать и перепроверять данные вручную. К сожалению, приходится сравнивать «яблоки с попугаями», потому что каждый Cloud провайдер рассчитывает стоимость хостинга немного «по‑своему» и включает в бесплатный тариф только часть функциональности.

Привет, Хабр!

При разработке фронтенда мы часто ограничиваемся тремя состояниями UI-запроса: loading, error, data (или success). Но это не всегда достаточно — особенно когда дело доходит до тонких UX-деталей, предотвращения гонок запросов и адекватного управления отменой при размонтировании компонентов. В статье рассмотрим, почему добавление состояния idle делает систему более надёжной, как реализовать конечный автомат для управления статусами, как отменять fetch-запросы и оптимизировать перерисовки.

За последние два года Go-сообщество выросло на 55% — с 3 млн до 4,7 млн разработчиков. Многие пришли в Go из других языков или только начинают свой путь в программировании. Без понимания идиоматики и ключевых особенностей языка даже опытные специалисты нередко сталкиваются с медленным кодом, дедлоками и утечками памяти.

Так что сегодня разберём, как организовывать пакеты, обрабатывать ошибки, безопасно работать с горутинами и каналами, оптимизировать аллокации и профилировать «горячие» участки через pprof. Советы одинаково пригодятся и опытным Golang-разработчикам, и тем, кто только начинает свой путь в Go.

После серии статей про svg-виджеты в tcl/tk, меня не оставляло чувство какой-то незавершенности. Всматриваясь в проект svgwidgets, стало понятно, что не хватает утилиты с удобным интерфейсом для генерации градиентной заливки.

Предположим, у нас появилась задача встроить какой-то функционал, реализуемый системой на Jmix/Vaadin/Spring на другой сайт или в веб-приложение. Сейчас существует большое количество статических генераторов и других систем управления содержимым, где у разработчика есть доступ только к фронтенд-части. Если это не портальная система, обычным решением в таких случаях будет использовать встраивание через IFrame. 

Для того чтобы приложение с интерфейсом на Vaadin открывалось в айфрейме за пределами локалхоста, ему требуется включенная поддержка cookie, что по современным стандартам безопасности возможно только если и сайт и приложение, находящиеся на разных доменах, работают по протоколу HTTPS доверенного уровня и для сессионных кук включен параметр Secure и выключен SameSite. Поэтому нам придется немного заморочиться, что бы это все заработало в Spring Boot-приложении даже если речь идет о тестовых средах.