Что такое расширяемый код? Из чего он складывается, по каким принципам строится и какой эффект оказывает на процесс разработки ПО? Отвечая на данные, казалось бы очевидные, вопросы мы рассмотрим и проанализируем основные методы построения расширяемого кода, их свойства и ограничения тем самым сформируя более четкое представление по рассматриваемой теме.

Когда говоришь слово микрофронты, то все одобрительно кивают головой. Это так модно и стильно. И, вроде, даже понятно.

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

Мы сделаем обзор от простейших вариантов и дойдем до крупных супер проектов. Подумаем, когда и какие могут быть варианты работы с ними.

Доклад будет полезен разработчикам любого уровня для знакомства и систематизации информации по данной теме

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

В докладе рассмотрим предоставляемые веб-платформой средства для создания модальных и всплывающих элементов: элемент dialog и атрибут popover.

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

Бурное развитие ML в последнее время помогает упростить разработку за счет того, что с его помощью можно автоматизировать многие рутинные задачи.
Часто от фронт-инженеров можно услышать, что верстка им не интересна, но заниматься ей все-таки приходится. Почему не объединить ML и верстку для упрощения разработки?
На самом деле эта идея не нова, и уже есть исследования, которые проводились с целью создать такой инструмент. Цель доклада – познакомить слушателей с тем, что уже есть, и рассказать, как оно работает и какие перспективы развития есть в будущем.

В NodeJS v20 модуль "node:test" получил бейдж “stable”. Стабильность – это хорошо, да и обновлять Jest порядком надоело. Я не смог удержаться и перевёл на новый тест-раннер один из своих проектов на 500+ юнит-тестов. Стоило оно того? А может лучше было взять Vitest? Обсудим! А ещё разберёмся, как в "node:test" обстоят дела с ассёртами, репортерами, моками, таймерами, удобством настройки, обработкой TypeScript и JSX, обсудим применимость на реальных проектах.

Тезисы:
• Почему скорость процессоров не успевает за веб-приложениями
• Причины большого количества JS-кода на сайте
• SPA по 20 мб уже действительность
• Инструменты куда мы смотрим (МТС) чтобы найти проблемы большого размера билдов и сократить его
• Графики скорости и восприятие людей (откуда возникли 60fps и почему важно придерживаться)
• Почему скорость браузерной страницы лагает на 4080ti, а Cyberpunk идет на максималках

* CLI от зари компьютерной эры и навсегда (но это не точно)
* Как устроено child_process API, интеграция с ОС
** Отдельно про shell
** Особо про потоки
* Shell-лексеры
** Область применения и устройство
** Сравнение имлементация shelljs, bun, yarn
* Shell-врапперы
** Путь от «сахара» к фреймворкам
** Концепции execa и zx
** $, который теперь не jQuery
* Мысли о будущем:
** А почему бы не <x>, вместо JS?
** shellGPT

Качество поставляемого функционала должно как-то измеряться, а отклонения от нормы фиксироваться. К сожалению во фронтенде часто пренебрегают таким инструментом, как SLO. В докладе я поделюсь опытом нашей компании в формировании ключевых метрик, как мы их агрегируем и куда выводим, какие показатели для нас самые важные. Опишу концепции уровней SL* и приведу примеры реальных кейсов.

* поговорим, для чего собирать метрики
* рассмотрим, что такое SLA, SLO, SLI
* обсудим, как считать базовые показатели и как приготовить сбор данных
* расскажу, какие инструменты существуют и какие из них удобные
* покажу, как это всё хранить, выводить и рисовать красивые графики
* расскажу, куда слать алерты, когда пробило и как выстроить культуру реакций на них

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

В докладе вы узнаете как:

— собрать стек Web-GL технологий, для решения широкого спектра картографических задач
— поделить планету на части вместе с H3-сотами
— отобразить большие данные на карте, используя гибридную кластеризацию
— сэкономить работу на стороне бэка, используя геодезические преобразования при отрисовке линий
— реализовать real-time анимацию объектов на примере спутниковой группировки

Обещаю, будет как минимум красиво, как максимум — полезно!

Описание и примеры наиболее актуальных клиентских уязвимостей. Особенности эксплуатации уязвимостей во фреймворках React, Vue, Angular. Рекомендации по предотвращению появления уязвимостей на клиенте.

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

Осветим три основных кейса использования Valibot:

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

Заключение доклада подчеркнёт, как Valibot интегрируется в рабочие процессы, повышая качество веб-разработки и способствуя созданию надёжных приложений.

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

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

Фронтенд-разработчики пишут на Javascript, Typescript, выбирают себе фреймворк по вкусу, библиотеки компонентов, пишут разнообразные тесты, а сеть принимают как должное. Ну что там – HTTP-запросы во вкладке Network ходят туда-сюда, тут запрос POST, тут GET, все работает – работает, не трогай!

Мы тоже так думали. Пока к нам не пришли странные пользователи, которые зачем-то открывают все в новой вкладке. «Закройте!» – говорили мы им, но с каждым новым репортом становилось все яснее, что долго так продолжаться не может.

И мы отправились в большое приключение – снимать таинственное проклятие седьмой вкладки.

Как делать фотографии не хуже чем в нативном приложении?
Что такое WebRTC? Что такое MediaStream?
Как скармливать правильно видеопоток OCR моделям машинного обучения?
Все ответы на эти вопросы вы найдете в данном докладе!
И, разумеется, не забудем про подводные камни!

Сравним Bun vs Node. Так ли он хорош? Рассмотрим, почему был выбран JSCore, как он работает и в чем отличие от V8. Поговорим о Zig, и ответим на вопрос: стоит ли переезжать на Bun уже сейчас или нет?

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

Введение:
- Мотивация доклада - почему ИИ это важно на фронтенде и сделает тебя лучше
Про технологию:
- Что такое тенсорфлоу
- Направления применения тенсорфлоу (зрение звук текст..)
- Кейсы решений для бизнеса на фронтенде (у многих нет понимания именно КАК применять?)

Примеры реализаций:
- Процесс работы с TensorFlow
- Делаем "умное рисование"
- Делаем классификацию документов и меняем UI/UX с ИИ
- Использование модели ИИ

Заключение:
- выводы/результаты

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

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

Боишься, что твой код уронит прод и компания понесет миллионные убытки? Этого легко избежать, если использовать современные практики разработки: автоматизация проверок (линтинг, тестинг), автоматизация мониторинга, практики развертывания и деливери кода. В докладе я расскажу, как все эти практики помогают перестать волноваться после нажатия кнопки "merge" и "deploy"

В докладе разберём, какие инструменты для управления зависимостями есть в экосистеме Javascript и поймём, какие проблемы они решают

Как написать свой собственный REPL и где его можно применить

Начнем с простого примера https://raiffeisen-dgtl.github.io/Frontend-editor-light/

применим
- monaco-code-editor
- добавим поддержку библиотек (статически)
- будем собирать TS в браузере через babel-stand-alone

добавим
- загрузку библиотек динамически по вводу строки import ... froom 'название библиотеки' посредством CDN и ESM https://github.com/Tetragius/editor/blob/main/src/Components/Playground/script.ts
- добавим файловую систему
- улучшим сборку перейдем с babel-stand-alone на esbuilder
https://github.com/Tetragius/editor/blob/main/src/Services/ESbuilder.ts
- добавим загрузку ассетов

Итог полноценный REPL для разработки на TS

Дополнительно
- LSP (language server protocol) - или как обстоят дела не с TS
- Добавляем онлайн и совместную работу

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