All streams
Search
Write a publication
Pull to refresh
12
0
Александр Шатилов @alexbraun

Tech Lead using Angular & .net

Send message

Основы реактивного программирования с использованием RxJS. Часть 3. Higher Order Observables

Reading time8 min
Views39K


В данной статье мы рассмотрим, как можно в одном потоке обрабатывать другой, для чего это нужно, и как нам в этом помогут операторы Higher Order Observables (дальше HOO).

Серия статей «Основы реактивного программирования с использованием RxJS»:



При работе с потоками часто возникает ситуация, когда необходимо в качестве значения одному потоку передать результаты работы другого. Например, мы хотим выполнить ajax запрос и его ответ обработать в текущем потоке, или запустить несколько параллельных запросов, реализовать pooling. Думаю, многие привыкли решать подобные задачи, используя такой механизм как promise. Но можно ли решать их используя RxJS? Конечно, и все куда проще чем вы думаете!
Читать дальше →

Построение библиотек компонентов и их организация. Или как извлечь максимальную пользу для бизнеса c React и Angular

Reading time3 min
Views4.7K

Наша компания разрабатывает десятки продуктов. Ряд продуктов работает на Angular, ряд на React. Пользователи систем в зависимости от этапа бизнес-процесса и роли взаимодействует с определенным продуктом. Часто, в рамках бизнеса мы должны показывать одни и те же данные в разных продуктах. Эти данные отображаются в виде UI компонентов.

В этой статье мы узнаем как можно организовать библиотеки компонентов для решения задач бизнеса. Научимся переиспользовать и запускать React библиотеку внутри Angular. Таким способом мы сможем решать задачи бизнеса гибко и эффективно.

Читать далее

Angular: создание и публикация библиотеки

Reading time5 min
Views20K

Начнем с начала


Если мне не изменяет память, то с версии 6 в angular появилась возможность создавать в одном workspace проекты разных типов: application и library.

До этого момента люди, которые хотели создать библиотеку компонент, скорее всего, пользовались отличным и полезным пакетом ng-packagr, который помогал создавать пакет в принятом для angular формате. Собственно, предыдущую библиотеку я создавал при помощи этого инструмента. Теперь команда angular включила ng-packagr в angular-cli и добавила schematics для создания и сборки библиотек, расширила формат angular.json и добавила еще несколько приятностей. Давайте теперь пройдем путь от ng new до npm install — от создания пустой библиотеки до ее публикации и импорта в сторонний проект.
Читать дальше →

Индикатор качества канала серверного WebRTC через TCP

Reading time5 min
Views3.6K


Publish и Play


Существует две основных функции работы WebRTC на стороне сервера в области потокового видео: публикация и воспроизведение. В случае публикации видеопоток захватывается с вебкамеры и двигается от браузера к серверу. В случае воспроизведения, поток двигается в обратном направлении — от сервера к браузеру, декодируется и воспроизводится в браузерном HTML5 <video> элементе на экране устройства.

Читать дальше →

Рендеринг в веб

Reading time12 min
Views18K

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

Читать далее

Микросервисы vs. Монолит

Reading time20 min
Views72K
В начале ноября на ютуб-канале Яндекс.Практикума прошли дебаты «Микросервисы, Монолит и Зомби». Ведущие дебатов — наставник курса «Мидл Python-разработчик» Руслан Юлдашев и техлид курса Савва Демиденко — разобрали архитектуры двух систем, прошлись по реальным задачам и ошибкам из своей рабочей практики и по очереди защищали свои позиции.

Обсуждение растянулось на 100 минут, поэтому мы публикуем сокращённую текстовую расшифровку.



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

Вы узнаете, как врачи регионов России не получали зарплату из-за микросервисов и сколько монолитов можно запустить, пока согласовывается интерфейс между сервисами.
Читать дальше →

Прекратите использовать Ngrx/effects для этого

Reading time9 min
Views24K
перебор с эффектами

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

Как работает JS: WebRTC и механизмы P2P-коммуникаций

Reading time14 min
Views45K
[Советуем почитать] Другие 19 частей цикла
Часть 1: Обзор движка, механизмов времени выполнения, стека вызовов
Часть 2: О внутреннем устройстве V8 и оптимизации кода
Часть 3: Управление памятью, четыре вида утечек памяти и борьба с ними
Часть 4: Цикл событий, асинхронность и пять способов улучшения кода с помощью async / await
Часть 5: WebSocket и HTTP/2+SSE. Что выбрать?
Часть 6: Особенности и сфера применения WebAssembly
Часть 7: Веб-воркеры и пять сценариев их использования
Часть 8: Сервис-воркеры
Часть 9: Веб push-уведомления
Часть 10: Отслеживание изменений в DOM с помощью MutationObserver
Часть 11: Движки рендеринга веб-страниц и советы по оптимизации их производительности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 13: Анимация средствами CSS и JavaScript
Часть 14: Как работает JS: абстрактные синтаксические деревья, парсинг и его оптимизация
Часть 15: Как работает JS: классы и наследование, транспиляция в Babel и TypeScript
Часть 16: Как работает JS: системы хранения данных
Часть 17: Как работает JS: технология Shadow DOM и веб-компоненты
Часть 18: Как работает JS: WebRTC и механизмы P2P-коммуникаций
Часть 19: Как работает JS: пользовательские элементы

Сегодня мы публикуем перевод 18 части серии материалов, посвящённых всему, что связано с JavaScript. Здесь мы поговорим о технологии WebRTC, которая направлена на организацию прямого обмена данными между браузерными приложениями в реальном времени.

image
Читать дальше →

Медитации, обновленный дизайн видеозвонков, компоненты Fluid и другие новые функции в Microsoft Teams

Reading time3 min
Views2.7K

Компания Microsoft представила обновления для Teams, Microsoft Teams Rooms и Viva, ориентированные на гибридную рабочую среду и продуктивную совместную работу. 

Заглядывайте под кат и изучайте 7 нововведений!

Читать далее

Могучие Typescript Декораторы — как работают, во что компилируются и для каких прикладных задач применимы

Reading time9 min
Views53K

Каждый Ангуляр разработчик видел декораторы в тайпскрипт коде. Их используют, чтобы описать Модули, сконфигурировать Dependency Injection или настроить компонент. Другими словами, декораторы используются, чтобы описать дополнительную информацию, или метаданные, для фреймворка или компилятора (в случае Ангуляра). При чем, Ангуляр лишь один из примеров. Существуют многие другие библиотеки, использующие декораторы для простоты и наглядности кода, как декларативный подход. Как .NET разработчик в прошлом, я вижу много сходства между TS декораторами и .NET аттрибутами. Наконец, набирающий популярность NestJS фреймворк для бекенд приложений (абстракция над Node), также построен на интенсивном использовании декораторов и декларативном подходе. Как это все работает и каким образом использовать декораторы в своем коде, чтобы он был более удобным и читабельным? Мы все понимаем, что после компиляции TS кода мы получаем Javascript код. В котором нет понятия декоратор, как и многих других Typescript особенностей. Поэтому для меня наиболее интересным является вопрос, во что превращается декоратор после компиляции. Занимаясь этим вопросом, я сделал выступление на митапе в Минске и хочу поделиться статьей.


Читать дальше →

WebSockets в Angular: cоздаем Angular Service для работы с вебсокетами

Reading time9 min
Views48K
image
В этой статье я постараюсь детально охватить узкую сферу применения технологии в рамках фреймворка Angular и его уже неотъемлемого помощника — RxJs, при этом мы намеренно не будем касаться серверных реализаций, т.к. это полноценная тема для отдельной статьи.

Данный текст будет полезен тем, кто уже знаком с Angular, но хочет углубить свои знания непосредственно по теме.
Читать дальше →

Kotlin. Автоматизация тестирования (Часть 2). Kotest. Deep Diving

Reading time30 min
Views9.1K

Kotest


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


В этой части мы углубимся в возможности Kotest:


  • покажу все варианты группировки тесты
  • расскажу про последовательность выполнения тестов и спецификаций
  • изучим возможности параллельного запуска
  • настроим таймауты на выполнение тестов
  • проговорим про ожидания и Flaky-тесты
  • рассмотрим использование Фабрик тестов
  • и напоследок исследуем тему Property Testing

Все части руководства:


Читать дальше →

Почему мы перешли с Webpack на Vite

Reading time2 min
Views47K
image


Миссия Replit — сделать программирование более доступным. Мы предоставляем людям бесплатные вычисления в облаке, чтобы они могли создавать приложения на любом устройстве. Одним из самых популярных способов создания приложений в Интернете на сегодняшний день является React. Однако исторически инструменты React были медленными на Replit. В то время как экосистема JavaScript создала отличные инструменты для профессиональных разработчиков, многие из самых популярных из них, такие как Create React App и Webpack, становятся все более сложными и неэффективными.

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

Этот новый опыт основан на Vite, инструменте сборки JavaScript, который обеспечивает быструю и экономичную разработку. Vite поставляется с рядом функций, включая HMR или Hot Module Replacement, команду сборки, которая объединяет ваши инструменты с Rollup, и встроенную поддержку TypeScript и JSX.

Построение компонентов с выпадающими блоками с помощью Angular и Material CDK

Reading time5 min
Views9.5K

Каждое приложение использует компоненты с выпадающими блоками. Такие панели используются в выпадающем списке, Autocomplete, Tooltip и т.д. В Material CDK есть инструмент Overlay для создания такого функционала.

В этой статье мы рассмотрим какую проблему решает Overlay CDK, кто использует его и напишем свой компонент на базе этого инструмента.

Читать далее

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

Reading time6 min
Views5.9K

Как известно, мы в Smart Engines занимаемся системами компьютерного зрения и распознавания документов, а также научными исследованиями в этой области. В течение нескольких лет в фокусе нашего внимания находились системы распознавания документов, удостоверяющих личность. Одной из критичных проблем, возникающих при подготовке научных статей, является отсутствие открытых датасетов, на которых можно демонстрировать сообществу разработанные нами алгоритмы и подходы. В связи с этим два года назад мы начали работу над серией открытых пакетов изображений и видеоклипов ID-документов, предназначенных, главным образом, для исследователей, и о результатах этой работы хотели бы рассказать вам под катом.


Читать дальше →

Как мы научили нейросеть определять документы

Reading time4 min
Views10K


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

Для чего это понадобилось


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

Читать дальше →

PassportVision — простой способ распознавать документы

Reading time8 min
Views93K
Наверняка вам доводилось попадать в такую ситуацию: заходите в какое-нибудь учреждение (почта, банк, больница, кассы и т. п.), где для достижения ваших целей необходимо предъявить паспорт. И вроде очередь-то небольшая, всего 5 человек, но ждать придётся очень долго, ведь тётя Маша тратит по несколько минут на внесение данных с каждого паспорта в компьютер. Вам остаётся только наблюдать, как её указательный палец не спеша планирует над клавиатурой в поисках очередной клавиши.

Мы были озадачены такой печальной ситуацией в современном обществе и написали программку PassportVision, которая умеет распознавать данные с разных документов и отдавать результат пользователю в удобной форме. Задача оказалась совсем не такой простой, как может показаться на первый взгляд: в ходе работы над проектом мы узнали очень много нового про отечественные документы, компьютерное зрение и пользовательские интерфейсы. Голова уже полна новыми идеями о дальнейшем развитии программы, но мы решили найти время, чтобы поделиться опытом и полученными знаниями.



Сегодня в выпуске:
  • Популярные заблуждения о паспортах
  • Немного об используемых технологиях
  • Наш подход к интерфейсу
  • Как лучше всего отдать данные пользователю
Читать дальше →

Непрерывная интеграция и развертывание Docker в GitLab CI

Reading time20 min
Views77K
В этом руководстве рассмотрим вариант настройки непрерывной интеграции и развертывания Flask приложения на Docker Swarm через GitLab CI.

Сначала мы рассмотрим настройку рабочей среды, включая создание серверов для нодов Docker Swarm. Затем создадим простое приложение Flask с Redis и подготовим GitLab CI для непрерывной доставки.
Читать дальше →

Moscow JS Meetup в Райффайзенбанке: сохраняйте трансляцию

Reading time2 min
Views1.7K
Присоединяйтесь к трансляции Moscow JS Meetup 30 января: будем отвечать на вопрос, что такое «чистый код», найдем максимум багов за минимум времени, пройдем путь к разработке расширяемых интерфейсов и узнаем про способы перформанса Webpack и Babel. Планы — огонь!

Подключайтесь в 19:30!


Angular и SEO: как их подружить?

Reading time3 min
Views24K

Несмотря на заявления Google и Яндекс о поддержке поисковыми ботами парсинга сайтов SPA, надеяться на нормальную индексацию не стоит — у поисковых ботов мало ресурсов, ваше приложение должно максимально быстро отрабатывать, иначе, вам либо порежут рейтинг, либо не спарсят страницу, так же бот может не дождаться отработки всех ваших скриптов…
(исследование Google bot)


Изменение посещаемости

Мой маленький проект для исследования технологий — изменение посещаемости, после перехода на Server Side Rendering (SSR)


Как настроить Angular и готовые примеры ниже подкатом.

Читать дальше →

Information

Rating
Does not participate
Location
Москва, Москва и Московская обл., Россия
Date of birth
Registered
Activity