Меня зовут Павленко Виталий, я Team Lead в команде UI-kit в Профи.В какой-то момент мы хотели решить несколько проблем с UI-kit в наших React Native приложениях:UI-kit был слишком медленный. И здесь важно уточнить, что он был сделан с использованием styled-components.В UI-kit не было возможности темизации, потому что токены импортировались как модуль в каждом компоненте. И как следствие, в приложении невозможно было сделать темную тему, потому что при смене токенов оно бы просто не перерендери…
React — одна из самых популярных JavaScript-библиотек для создания пользовательских интерфейсов. В её новой версии произошли значительные изменения, и сейчас я расскажу про самые важные. React 18 теперь умеет существенно лучше работать с приложениями, содержащими большие данные. С помощью концепции виртуального DOM и нового инструмента — параллельного рендеринга — React эффективно обновляет только необходимые компоненты при изменениях, и это даёт молниеносную скорость прорисовки. Появилис…
Весной этого года мы выпустили Squadus — цифровое рабочее пространство для компаний любого масштаба. Решение позволяет общаться в чатах, проводить конференции, совместно работать над документами и автоматизировать типовые действия с помощью ботов.Сегодня расскажем о том, как в мобильной версии Squadus реализовали востребованную функцию — «прыжок к сообщению» в чате (jump to message).Для чего современным чатам нужна эта возможность? Прыжок позволяет «отмотать» чат от цитируемого сообщения к ори…
ПредисловиеНедавно я писал конфигуратор в Shopify и решил поделиться тем, как добавить несколько товаров в Шопифай корзину. Я находил не так много материалов по этому вопросу, тем более на русском языке.Прикрепляю скринкаст того, что можно сделать при помощи этого. Но применений довольно много, не только конфигуратор. В скринкасте я добавил 6 товаров по одному клику на "Add to cart" кнопку. Но до лимита в количестве добавляемых товаров я не дошёл, может их и нет.Cart APIЧтобы добавить …
В сети много статей и докладов, которые описывают React Fiber, но, к сожалению, они сейчас уже не актуальны. Заметив это, я решил разобраться и актуализировать информацию. Моими основными помощниками были исходники и отладчик, поэтому здесь вы увидите множество ссылок на код из репозитория React. Теперь я хочу поделиться результатами своей работы с вами.Тема разделена на две статьи. Первая статья расскажет о процессе обновления и внесения изменений в DOM. Вторая статья посвящена реализации не …
В продолжение моей предыдущей статьи о MTA Log Parser хотелось бы поделится результатами работы над теми хотелками, которые появились после ее публикации. Появился первый feedback, который в итоге принес следующие нововведения:поддержка учетных записей (внутренних или посредством LDAP авторизации), пока без разграничений по правам доступа (было бы что разграничивать =) )возможность экспорта отображаемой страницы в xls файл для каких-либо служебных нуждпарсинг логов MS Exchange Server (пока в з…
Всем привет!Обычно Tailwind используют для каких-то MVP/админок/не очень больших проектов, но мне кажется, что Tailwind, имеет место быть в средних и крупных проектах. Большинство его минусы решаемы, а плюсы чертовски хороши :)В этой статье я распишу его плюсы и минусы и как можно минусы превратить в плюсы.Сначала, коротко о том, что такое TailwindTailwind - это CSS-фреймворк, предоставляющий набор готовых классов для стилизации веб-интерфейсов.На главной Tailwind можно прочитать вот это - Rap…
Эта статья — перевод оригинальной статьи "Introducing runes".Также я веду телеграм канал “Frontend по-флотски”, где рассказываю про интересные вещи из мира разработки интерфейсов.ВступлениеВ 2019 году Svelte 3 превратил JavaScript в реактивный язык. Svelte - это фреймворк для создания веб-интерфейса, который использует компилятор для превращения декларативного кода компонентов в такой...<script> let count = 0; function increment() { count += 1; } </script> <button…
Современный JS предоставляет множество способов перебора массива. Но какой из них является наиболее эффективным по скорости?Чтобы ответить на этот вопрос, мы проведем тесты, перебирая массивы разной длины и вызывая для каждого элемента метод toString().Рассмотрим основные способы перебора: for, for(reverse), while, do..while, for..in, for..of, for..each.Важно! Точность результата console.time() сильно зависит от конфигурации вашей системы.Для начала протестируем скорость каждого способа на мас…