Обновить
256K+

JavaScript *

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

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

Базовый вариант использования Task Unwrap

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели2.8K

Недавно, после нескольких месяцев отсутствия использования .Net/C#, я улучшал существующее приложение .Net/C# WPF, используя .Net Task Parallel Library (TPL).

Но, наивно применяя шаблоны обещаний JavaScript, которые я использовал в предыдущие месяцы, я столкнулся со странной проблемой, которая заставила меня использовать довольно экзотический метод расширения Unwrap.

В этой статье описывается проблема, объясняется ее причина, предлагается исправление с помощью Unwrap и, наконец, представлена ​​более современная версия с парадигмой async/await C# 5.0.

Простой рабочий процесс в JavaScript с Promises

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

Читать далее

Самые полезные библиотеки JS для красивых анимаций

Время на прочтение5 мин
Охват и читатели32K

Интересное в исполнении приложение всегда сможет привлечь внимание, поскольку мы любим, когда красиво. Но что стоит за этим "красиво"? И начинка, и внешний вид. Сегодня я бы хотела поговорить о внешнем виде, ведь встречают по одежке. А конкретно - про анимации.

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

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

Приятного прочтения :-)

Читать далее

Что такое semantic-release и как с ним работать

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели17K

Привет! Я — Алексей Бондаренко, работаю в команде Платформа Банки.ру. Сегодня хочу рассказать о semantic-release и его практическом применении на примере упрощения разработки и внедрения библиотеки в проект. 

Читать далее

То, что вы пишете, это точно composables?

Время на прочтение2 мин
Охват и читатели11K

В этой статье c помощью простого чек листа за пару шагов выясним, являются ли функции, которые вы пишете в своем vue коде, настоящими composables

Читать далее

Книга «React быстро. 2-е межд. изд.»

Время на прочтение11 мин
Охват и читатели9.9K
image Привет, Хаброжители!

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

«React быстро. 2-е издание» предлагает уникальный подход к освоению фреймворка React. Более 80 компактных примеров проведут читателя от изучения основ работы к созданию довольно сложных приложений. В книге подробно описаны многие функциональные компоненты, хуки React и средства доступности веб-приложений, а также представлены интересные проекты для отработки новых навыков.

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

8 неочевидных уязвимостей при разработке e-commerce проекта на NextJS

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели4K

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

В этом материале расскажем о безопасности на примере мультиязычного e-commerce сервиса – интернет-магазина с аккаунтом покупателя. Проект построен на NextJS, где часть бекенда на JS и пишется фронтендерами. Поэтому помнить о безопасности в таком случае приходится более старательно, держа в уме случаи, о которых расскажем в этой статье. 

Читать далее

Typescript Generics

Уровень сложностиСложный
Время на прочтение8 мин
Охват и читатели13K

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

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

При этом написание типов бывает действительно утомительным, но Typescript предоставляет возможности ускорить и этот процесс. Здесь нам на помощь придут дженерики.

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

Читать далее

Топ-3 причины, почему вы должны использовать Copilot

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели49K

Всем привет! Меня зовут Анатолий Барцев, я frontend-разработчик в команде Модерации Циан. Я решил протестировать Copilot, чтобы оценить, полезен ли он для реальной разработки. В статье расскажу, какие выделил для себя плюсы использования, а также покажу, как GitHub Copilot помогает в разработке на примере проекта на React/Typescript.

Читать далее

Анатомия htmx

Уровень сложностиСредний
Время на прочтение15 мин
Охват и читатели42K



Hello world!


По данным 2023 JavaScript Rising Stars библиотека htmx заняла второе место в разделе Front-end Frameworks (первое место вполне ожидаемо принадлежит React) и десятое место в разделе Most Popular Projects Overall.


htmx — это библиотека, которая предоставляет доступ к AJAX, переходам CSS, WebSockets и Server Sent Events прямо из HTML через атрибуты, что позволяет создавать современные пользовательские интерфейсы (насколько сложные — другой вопрос), пользуясь простотой и мощью гипертекста. На сегодняшний день у библиотеки почти 30 000 звезд на Github. Удивительно, что до такого решения мы додумались только сейчас, учитывая, что весь функционал был доступен уже 10 лет назад (вы сами убедитесь в этом, когда мы изучим исходный код htmx).


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

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

Структура объекта в JavaScript движках

Время на прочтение23 мин
Охват и читатели12K

С точки зрения разработчика, объекты в JavaScript довольно гибкие и понятные. Мы можем добавлять, удалять и изменять свойства объекта по своему усмотрению. Однако мало кто задумывается о том, как объекты хранятся в памяти и обрабатываются JS-движками. Могут ли действия разработчика, прямо или косвенно, оказать влияние на производительность и потребление памяти? Попробуем разобраться во всем этом в этой статье.

Читать далее

Создание библиотек и публикация в npm

Уровень сложностиСредний
Время на прочтение18 мин
Охват и читатели12K

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

Читать далее

Деструктивный пакет everything напомнил об уязвимостях реестра npm

Время на прочтение4 мин
Охват и читатели3.7K


Пакетный менеджер npm попал в неприятную историю, которая снова возродила споры о принципах работы реестра с микрозависимостями для JavaScript (и Node.js).

Критики утверждают, что уровень зависимостей в npm слишком большой. Многие помнят историю 2016 года с микромодулем left-pad из нескольких строчек кода, которые реализуют примитивную функцию вставки пробелов в левой части строк. Он был установлен в качестве зависимости в React, Babel и других пакетах. Автор и мейнтейнер left-pad решил в знак протеста отозвать его, что вызвало массовый сбой в работе веб-сайтов. После этого компания npm Inc. запретила авторам отзывать свои пакеты без разрешения администрации.

Сейчас мы наблюдаем в каком-то смысле продолжение этой истории.
Читать дальше →

Деструктуризация в React. Очевидно, но важно

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

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

Казалось бы, что можно рассказать о том, о чем все и так знают? Но практика и чтение статей на Хабре, показали, что есть некоторые нюансы использования деструктуризации в React, которые не все из нас знают или просто не все из нас о них задумываются, хотя они и являются очевидными.

Читать далее

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

Почему реактивность без VDOM (с реальным DOM) лучше, чем реактивность с VDOM?

Уровень сложностиСредний
Время на прочтение4 мин
Охват и читатели7.3K

Всем привет! В этой статье я хотел бы поделиться своими мыслями о том, почему виртуального DOM можно избежать при создании реактивности сегодня. Я работаю со всем этим уже около полутора лет, создавая фреймворк Cample.js, и у меня есть некоторые соображения по этому поводу.

Читать далее

Как я отрендерил миллион строк в React

Уровень сложностиСредний
Время на прочтение9 мин
Охват и читатели11K

Недавно я столкнулся с задачей, известной как one billion row challenge. Два аспекта этого вызова меня заинтриговали:

1. Каковы будут последствия, если я попробую решить этот вызов на фронтенде?

2. Удастся ли мне это?

Хотя я не уверен в возможности визуализировать миллиард строк в таблице, цифра в миллион кажется вполне достижимой. Узнав о таком интересном вызове, я решил заняться маленьким проектом, целью которого было отображение миллиона строк в React.

Давайте я вас подробно ознакомлю с тем, что именно произошло, как это было сделано и по каким причинам.

Читать далее

Лонгрид о JavaScript

Время на прочтение6 мин
Охват и читатели11K

JavaScript — ужасный язык программирования. По сравнению с другими распространёнными языками он выглядит генетическим уродом. Дело даже не в отсутствии многопоточности, или статической типизации, или того, что node_modules для простого проекта занимают сотни мегабайт, а в том, что в JavaScript столько стилей и подходов, что семь человек одну и ту же несложную задачу могут написать на нём семью различными способами. Каждый из них с трудом будет понимать, что написал другой, и тихо материться. Причем, так напишут и новички, и опытные программисты, которые просто привыкли писать по‑своему или захотели выпендриться.

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

Читать далее

Представляем Firebolt: Продуктивный React фреймворк

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

Создание веб-приложений должно быть простым...

К сожалению, современная веб-разработка постепенно становится все более сложной и запутанной. Веб всегда был просто вебом, так почему же он не стал проще? Почему мы не становимся более продуктивными?

Сегодня мы рады публично представить Firebolt: новый вид фреймворка react для создания веб приложений. В Firebolt собрано все, чему мы научились за последние несколько лет, и сведено в крошечный, молниеносно быстрый фреймворк, созданный для того, чтобы вы работали продуктивно и приносили пользу.

Читать далее

Основы Event Loop в JavaScript

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели21K

В JS Event Loop позволяет непрерывно проверять, есть ли в очереди задачи, и, когда стек вызовов пуст, передавать эти задачи на выполнение. Таким образом, долгие операции не мешают продолжению выполнения кода. Именно благодаря Event Loop приложение может оставаться отзывчивым, позволяя юзерам продолжать взаимодействие с интерфейсом, пока в фоне выполняются тяжелые задачи.

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

В этой статье мы рассмотрим, как реализовать Event Loop в JavaScript.

Читать далее

Знакомьтесь, SafeTest — новый подход к тестированию фронтенда

Время на прочтение8 мин
Охват и читатели6.7K


В этой статье мы поговорим о SafeTest — революционной библиотеке, которая предлагает свежий взгляд на сквозные (E2E) тесты для веб-приложений с пользовательским интерфейсом.
Читать далее

Темная сторона Open Source

Время на прочтение7 мин
Охват и читатели18K

"Вносите вклад в открытый исходный код, это лучшее, что со мной случилось!" - все чаще и чаще слышу я в Twitter в последнее время. Хотя я не возражаю против самого высказывания, мне кажется, что в нем непреднамеренно (или намеренно) упускается приличная часть правды о вкладе и авторстве открытого кода. Это похоже на то, как если бы вы рекомендовали туристический маршрут, с которого в конце концов открывается незабываемый вид, но при этом вы не упоминаете о том, сколько трудностей и подготовки требует этот поход.

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

Читать далее