Обновить
193.91

JavaScript *

Прототипно-ориентированный язык программирования

Сначала показывать
Порог рейтинга
Уровень сложности

JavaScript: структуры данных и алгоритмы. Часть 2

Уровень сложностиСредний
Время на прочтение36 мин
Количество просмотров14K


Привет, друзья!


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



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


Код, представленный в этой и других статьях серии, можно найти в этом репозитории.


Интересно? Тогда прошу под кат.

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

Стреляем себе в ногу из localStorage

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров12K

Все фронтендеры любят localStorage — в него можно прикопать данные без всяких баз и серверов. Но из localStorage можно отлично обстрелять себе ногу. сегодня расскажу про 6 встроенных пулеметов и презентую библиотеку banditstash, которая нежно, но настойчиво прикрывает ваши ножки.

Читать далее

Расширяем возможности мобильного приложения на WebView. Опыт Ozon Банк

Время на прочтение10 мин
Количество просмотров8.2K


Привет, Хабр! Меня зовут Георгий, я руководитель команды Ozon Банк iOS. Я занимаюсь разработкой и развитием мобильного направления финансовых продуктов Ozon.

Сегодня хочу поделиться опытом нашей команды по запуску мобильного приложения на WebView.  

Часто разработчики используют только встроенный API взаимодействия JavaScript c нативными кодом, например Web API, но нам этого оказалось мало, и мы расширили спектр возможностей подхода web-native. Внутри статьи я расскажу, какой подход выбрал, как к этому пришёл и как обошёл возникшие проблемы. Подчеркну плюсы и минусы использования своего решения и в конце предложу несколько идей дальнейшего развития выбранного пути.

Читать далее

Стоит ли решать задачи на Codewars? Или как я полюбил алгоритмы

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров38K

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

Я Frontend разработчик с опытом около 4 лет, и за это время алгоритмы в чистом виде мне ни разу не пригодились. Однако я понял, что использовал алгоритмы всю жизнь, просто не называл это так.

Читать далее

Как устроен Braid?

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров10K

Многие играли в знаменитую инди‑игру Braid и многие были впечатлены механикой возврата во времени. Для меня, как для программиста, это было особенно интересно, я решил попробовать повторить эту механику и вот что я узнал.

Читать далее

JavaScript: структуры данных и алгоритмы. Часть 1

Уровень сложностиСредний
Время на прочтение33 мин
Количество просмотров34K


Привет, друзья!


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



Сегодня мы будем говорить о самых простых и популярных структурах данных: односвязном и двусвязном списках, стеке и очереди.


Код, представленный в этой и других статьях серии, можно найти в этом репозитории.


Интересно? Тогда прошу под кат.

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

Playwright и Allure как хорошая практика для разработки веб-приложения

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров6K

Разработчики вечно ищут баланс: как выпускать фичи быстро, качественно и желательно небольшой командой. Наш рабочий рецепт – это фронты + e2e-тесты. Рассказываю, как мы используем автотесты и визуализируем их результаты.

Читать далее

Изучение случайности в JavaScript

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров3.8K

В моем посте о создании утилиты цветовой палитры в Alpine.js случайность играла большую роль: каждый образец генерировался как композиция случайно выбранных значений Hue (0..360), Saturation (0..100) и Lightness (0..100). Когда я создавал эту демонстрацию, я наткнулся на Web Crypto API. Обычно при генерации случайных значений я использую метод Math.random(), но в документации MDN упоминается, что Crypto.getRandomValues() более безопасен. В итоге я решил попробовать Crypto (с фоллбэком на модуль Math по мере необходимости). Но это заставило меня задуматься, действительно ли "более безопасный" означает "более случайный" для моего варианта использования.

В чем разница

Как я написал загрузчик YouTube видео на Ktor + HTMX. Убийца React?

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров8.6K

Мы вырастили монстра, который больше не нужен (с)

Рассмотрим возможности применения модного фреймворка HTMX в связке с Ktor на примере написания загрузчика видео.

Читать далее

Управление зависимостями в Javascript заходит на новый виток? Работа с ES модулями без сборщиков

Уровень сложностиСредний
Время на прочтение13 мин
Количество просмотров8.8K

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

В итоге, я решил кратко пересказать вышеупомянутую статью, чтобы лучше самому усвоить тему, а также набросать проект по управлению зависимостями прямо на клиенте, через ES Modules. Так что вы можете прочитать либо оригинальную и полную статью у автора, либо сокращенную версию в первой половине этой статьи. А разбор работы ESM будет во второй половине.

Читать далее

Полный гайд по UI-китам: как их создавать, подключать и ничего не бояться

Уровень сложностиСредний
Время на прочтение14 мин
Количество просмотров22K

Привет! Я Леша Кузьмин, главный про фронтенду в AGIMA. Мы с коллегами решили суммировать наш опыт по подготовке UI-китов и сделать большую и внятную инструкцию для новичков. Во-первых, это удобно — будем давать эту статью нашим стажерам и падаванам. Во-вторых, нам не жалко — читайте, делитесь опытом, задавайте вопросы в комментариях.

Ниже разбираем всё с самого начала: от «зачем это вообще нужно» до «как использовать на реальном проекте». А в самом конце найдете репозиторий с фрагментами кода, которые можно использовать в своей работе. Статья для начинающих и не только начинающих Frontend-разработчиков. За помощь в ее подготовке благодарю мою коллегу Ангелину Николаеву.

Читать далее

Многопоточность JavaScript с SharedArrayBuffer и Atomics: основы

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров4K

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

Чтобы обойти эти ограничения, были введены Web Workers — они позволяют выполнять JS-код в фоновом потоке, параллельно с основным. Однако, все сложилось так, что простой обмен данными между основным потоком и воркерами через postMessage имеет свои ограничения и может быть недостаточно хорошим для некоторых задач.

Здесь помогают SharedArrayBuffer и Atomics.

Читать далее

Загрузка es-модулей в браузерные приложения

Время на прочтение7 мин
Количество просмотров2.3K

Мне тут на днях попеняли, что, мол, я не в курсе, "что из esm до сих пор нельзя собрать бандл без транспиляции". Ну что я могу сказать... я действительно не в курсе :) На мой взгляд, es-модули придумали как раз для того, чтобы загружать по мере необходимости JS-код непосредственно в браузер, и собирать модули в бандлы - это, ну... как гладить кошку против шерсти.

Я понимаю, что традиции / привычки / требования бизнеса / обратная совместимость / корпоративная этика и т.п. говорят о том, что код для браузерных приложений должен поставляться в бандлах и точка! Тем не менее, в некоторых случаях (малые приложения, быстрое прототипирование, распределённая разработка) сборка бандлов является излишней и код в браузер можно и нужно загружать непосредственно в виде es-модулей.

Читать далее

Ближайшие события

Коварные утечки памяти в React: как можно обжечься на useCallback и замыканиях

Время на прочтение9 мин
Количество просмотров10K
image

Я работаю в Ramblr, это ИИ-стартап, где мы строим на React сложные приложения для аннотирования видео. Недавно мне попалась сложная утечка памяти, которая возникает при одновременном использовании замыканий JavaScript и хука useCallback в React. Поскольку я вырос на .NET, мне потребовалось немало времени, чтобы разобраться в происходящем. Поэтому я решил написать этот пост и рассказать вам, чему меня научила эта ситуация.
Читать дальше →

Вам не нужен Lodash. Хватит! Пожалуйста

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров23K

На State Of JS 2023 Lodash занял первое место в топе библиотек - что меня сильно огорчило. Я топлю за его отказ последние годы - и хотел бы рассказать, почему я считаю его вредным и не особо вам нужным.

Ну давай!

Освоение программирования за 2 года с нуля или как я пытался автоматизировать реальное производство

Время на прочтение4 мин
Количество просмотров28K

Моя профессия далека от IT технологий. Я работаю на производстве кажется всю жизнь довольно давно. Тематика - производство и ремонт металлообрабатывающих станков. Производим станки как новые, так и ремонтируем. Стараемся все делать локализировано (импортозамещение ж)- все железки точим, шлифуем, собираем и т.д

Читать далее

Мощь AST в действии, или как переписать код 10 летней давности на ES6-модули и ничего не сломать

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров6.4K

Всем привет! Меня зовут Кирилл и я работаю фронтенд-разработчиком. Я расскажу о том, как мы перевели несколько тысяч файлов, написанных на JavaScript, с легаси кода, который использовал goog.module, на новые ES6-модули с помощью построения и преобразования абстрактного синтаксического дерева.

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

Читать далее

Новые методы появятся в Set JavaScript

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров5.2K

Привет всем! Я Кирилл Мыльников, frontend разработчик компании Usetech. Сегодня хочу поделиться информацией о новых методах, которые скоро появятся в коллекции Set в JavaScript.

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

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

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

Основные методы:

Читать далее

Подключаем библиотеку к проекту с помощью npm/yarn link

Время на прочтение9 мин
Количество просмотров6.5K

Привет! Меня зовут Света, я фронтенд-разработчик отдела спецпроектов в KTS.

Наш отдел разрабатывает и запускает около 100 проектов в год. При такой загрузке мы постоянно ищем новые способы ускорить и автоматизировать работу.

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

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

Читать далее

Web APIs, которые функционально приближают веб-приложения к нативным

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров19K

Исходные данные: мы с командой делаем банковское приложение. Веб-приложение. Не все поверят, но сегодня реально реализовать на вебе такой пользовательский опыт, от которого люди не будут скрипеть зубами и умолять вернуть им натив. Расскажу, какие Web API мы используем, раскрою тонкости и покажу примеры кода.

Читать далее

Вклад авторов