JavaScript *

▍ Правило наименьших полномочий

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

В данной статье содержатся тесты фреймворка Cample.js бета-версии 3.2.0-beta.6. Это нулевой отчёт о тестах. По мере изменения результатов фреймворка, возможно, могут выйти ещё несколько отчётов.

Отчёт включает в себя сравнения по скорости с популярными фреймворками и библиотекой, а также сравнение с реализацией на чистом javascript.

Каждый Frontend-разработчик знает, что такое объект Window. С самими объектом, вроде бы, все понятно. Но при детальном рассмотрении оказывается, что браузер никогда не отдает этот важнейший глобальный объект напрямую. В этой статье я предлагаю разобраться в спецификации HTML и в том, как именно ведет себя браузер в части глобального контекста.

Приложения, созданные на платформе 1С:Предприятие, могут быть развернуты в трёхзвенной архитектуре (Клиент – Сервер приложений – СУБД). Клиентская часть приложения может работать, в частности, как веб-клиент, в браузере. Веб-клиент – это довольно сложный фреймворк на JavaScript, отвечающий за отображение пользовательского интерфейса и исполнение клиентского кода на встроенном языке. Одна из задач, которая стояла перед нами в ходе разработки веб-клиента – это корректная работа с различного рода ресурсами (в первую очередь – их своевременное освобождение).

Мы провели анализ существующих подходов и хотим рассказать вам об этом. Добро пожаловать под кат!

Статья является продолжением первой части, в которой была обучена нейронная сеть для решения задачи соревнования Digit Recognizer на Kaggle. В предыдущей статье был использован трюк, который увеличил точность нейронной сети в контексте результатов соревнования (до 0.99 896), в результате чего позиция автора в лидерборде значительно выросла. В данной статье мы рассмотрим каким образом можно интегрировать и использовать обученную модель нейронной сети в систему для распознавания рукописных цифр.

В этой статье я расскажу о том, как создать игру "Крестики-Нолики" простыми способами, без необходимости писать код. Для этого я буду использовать нейросеть ChatGPT3.

В предыдущих статьях мы пришли к выводу, что для того, чтобы UI‑код не превращался в легаси, нам нужно отделить представление от бизнес‑логики и немного иначе, чем это делают Redux и Elm, так как оба подхода не позволяют сделать это полностью.

В данной статье мы порассуждаем о том, как такое разделение сделать.

React view как чистая функция состояния

React изменил наш подход к пользовательскому интерфейсу — его философия основана на простых, но мощных концепциях использования компонентов и однонаправленного потока данных.

Ещё считается, что React внес реактивность в пользовательский интерфейс, но это не так, так как шаблоны MVVM и фреймворки, которые сильно полагаются на реактивность, были введены раньше React. (Knockout и Angular с двойным биндингом данных, Ember.js Observable)

Эти концепции делают UI разработку не только интуитивнее, но и объединяют дизайн и разработку в одном инфополе. Кстати, Elm тоже полагается на подобные концепции и использует чистые композируемые функции представления без состояния.

Привет, Хабр! Меня зовут Александр Григоренко, я фронтенд-разработчик. В основном, занимаюсь разработкой приложений на React, но также постоянно экспериментирую с различными технологиями.

В своей работе я часто создаю собственные или использую уже готовые UI-компоненты. Проблема с такими компонентами заключается в том, что они часто ограничены определённым фреймворком, и их реализация требует написания сложной нестандартизированной логики. В течение долгого времени для базовых UI-компонентов, таких как диалоговые окна, использовались самописные решения, а в тяжёлых случаях и встроенные в JavaScript методы alert(), prompt() и confirm().

Отличная новость в том, что такой компонент можно реализовать с использованием нативного HTML-элемента <dialog>, который встроен в стандарт HTML5 и работает одинаково во всех современных браузерах.

Давайте познакомимся с возможностями <dialog> поближе.

Всем привет. Сегодня я бы хотел рассказать о том, с какими трудностями пришлось столкнуться при работе с менеджером node.js процессов PM2, и как нам пришлось расширить его возможности для того, чтобы его было можно использовать эффективнее.

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

Результат: Google - хорошо, Yandex - не очень

Hello world!

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

Хорошо, если вы знаете JS/Node.js и хотя бы слышали о WASM и Rust.

Продолжение перевода статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu, автора UnoCSS, в которой рассматривается уже сам UnoCSS.

Разбираемся, что же такое conditional types и как написать свои утилиты, такие как ReturnType, InstanceType, NonNullable и др., при помощи ключевых слов infer и extends.

Всем доброго дня! Комментарии к моей предыдущей статье о том, как я развиваю свой pet-проект, а также различные законы, подразумевающие локализацию персональных данных на серверах, размещенных на территории РФ (в частности Федеральный закон от 21.07.2014 № 242-ФЗ «О внесении изменений в отдельные законодательные акты Российской Федерации в части уточнения порядка обработки персональных данных в информационно-телекоммуникационных сетях»), озадачили меня идеей постепенного перевода всех данных приложения в РФ. В качестве сервера БД я отдал предпочтение сервису Supabase, который легко разворачивается в Docker на сервере.

В данном туториале я хочу обзорно пройтись по сравнению двух сервисов, представляющих собой не только СУБД, а BaaS (backend as a service), но внимание заострю именно на работе с данными, постараясь сравнить их функционал, производительность и простоту использования. Также приведу примеры обработки получения, обновления и удаления данных в Google Firebase Realtime Database и Supabase Realtime Database на JavaScript.

Стоит сразу сделать оговорку, что Realtime Database от Firebase - это облачная БД для хранения и синхронизации данных в реальном времени, в то время как БД от Supabase хоть и является её аналогом, но позволяет хостить базу данных самостоятельно ("под капотом" у Supabase располагается объектно-реляционная СУБД PostgreSQL).

Мы рассмотрим шаги, необходимые для переноса данных и обсудим примеры кода для реализации этого процесса.

Хотите узнать, как с помощью Nim создавать клиентские веб-приложения?

В этой статье я расскажу вам о веб-фреймворках в Nim и их возможностях, а также приведу примеры в сравнении друг с другом и другими фреймворками.

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

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

Отказ от third‑party кук уже не за горами. Однако в попытке уберечь пользователя от «слежки» браузеры рискуют по дороге отправить в могилу индустрию персонализированной рекламы (и не только, но сегодня про нее). Могу только представить, что испытывает Google, разрываясь между желанием сохранить лояльность пользователей Chrome и стремлением продолжить зарабатывать на рекламе сотни миллионов долларов ежедневно. В качестве решения проблемы, в рамках инициативы Privacy Sandbox, Google предлагает использовать Topics Api, как инструмент доступа к «интересам» пользователя без возможности его отслеживания.

Перевод статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu, автора UnoCSS, в которой обсуждается концепция Atomic CSS, плюсы и минусы Tailwind и Windi CSS

Что такое Atomic CSS?

Для начала давайте дадим правильное определение атомарному CSS. Из этой статьи Джона Полачека:

> Атомарный CSS — это подход к архитектуре CSS, при котором предпочтение отдается небольшим, одноцелевым классам с именами, основанными на визуальной функции.

В данной статье я расскажу про AMP-emails из личного опыта разработки , покажу примеры какие бывают емайлы, как их можно отправлять, в каких областях емайл-маркетинга они могут использоваться. У меня более 4 лет опыта работы с AMP-emails и мне есть чем с вами поделиться