Рубрика «javascript» - 96

Производительность — это один из важнейших вопросов, встающих перед разработчиками веб-страниц или веб-приложений. Никто не будет рад «падающему» от чрезмерной нагрузки приложению, или странице, которая загружается целую вечность. Пользователи веб-сайтов не готовы слишком долго ждать их загрузки или приведения их страниц в рабочее состояние. Согласно данным Kissmetrics, 47% посетителей ожидают, что веб-сайт загрузится менее чем за 2 секунды. 40% посетителей покинут сайт в том случае, если его загрузка займёт более 3 секунд.

12 советов по улучшению производительности JavaScript-приложений - 1

Автор материала, перевод которого мы сегодня публикуем, говорит, что, если учитывать вышеприведённые цифры, становится ясно, что производительность — это то, о чём всегда стоит помнить веб-разработчикам. Здесь будут приведены 12 рекомендаций по улучшению производительности JS-проектов.
Читать полностью »

Стартуем библиотеку компонентов на React и TypeScript - 1

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

Читать полностью »

Автотестирование: десять лайфхаков от команды Skyeng - 1

Привет, я Андрей Шальнев, QA Automation Lead в проекте Skyeng Vimbox. В течение года мы с командой занимались оптимизацией процессов автоматического тестирования и сейчас вплотную подошли к ее финальной стадии. А это хороший повод выдохнуть, пересмотреть бэклог и подвести какие-то промежуточные итоги. Для Хабры я решил сделать подборку из десяти наиболее полезных и при этом простых вещей, которые помогли нам справиться с задачей оптимизации автотестов. Надеюсь, статья пригодится QA-командам в растущих компаниях, где старые процессы тестирования уже не справляются с нагрузкой, и вопрос реорганизации встает ребром.

Читать полностью »

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

Одна из наиболее приятных возможностей React заключается в том, что эта библиотека не принуждает разработчика к строгому соблюдению неких соглашений, касающихся структуры проекта. Многое в этом плане остаётся на усмотрение программиста. Этот подход отличается от того, который, скажем, принят во фреймворках Ember.js или Angular. Они дают разработчикам больше стандартных возможностей. В этих фреймворках предусмотрены и соглашения, касающиеся структуры проектов, и правила именования файлов и компонентов.

Структурирование React-приложений - 1

Лично мне нравится подход, принятый в React. Дело в том, что я предпочитаю контролировать что-либо сам, не полагаясь на некие «соглашения». Однако много плюсов есть и у того подхода к структурированию проектов, который предлагает тот же Angular. Выбор между свободой и более или менее жёсткими правилами сводится к тому, что именно ближе вам и вашей команде.

За годы работы с React я испробовал множество различных способов структурирования приложений. Некоторые из применённых мной идей оказались более удачными, чем другие. Поэтому здесь я собираюсь рассказать обо всём том, что хорошо показало себя на практике. Я надеюсь, что вы найдёте здесь что-то такое, что пригодится и вам.
Читать полностью »

Dagaz: Эпизоды (часть 1) - 1Мы расшатали ваши умственные фильтры, и в результате появился ответ. Метод сработал, он будет действенным всегда. Все, что необходимо сделать — это избавиться от лишнего груза предрассудков…

Раймонд Джоунс "Уровень шума"

Dagaz появился не на пустом месте. Я всегда увлекался настольными играми и головоломками, а программированием занимаюсь сколько себя помню, но мысль о некоем «универсальном» движке просто не могла бы прийти мне в голову. К самой этой идее я относился скептически. Пока не увидел Zillions. К сожалению, продукт, на тот момент, уже не развивался, исходный код был недоступен, да и вообще, программа работала только под Windows. Спустя некоторое время, я решил взяться за открытый проект.
Читать полностью »

Знаете ли вы о том, что во многих современных браузерах имеется встроенный API, который называется Payment Request? Этот API описан в стандарте W3C, который направлен на поддержку работы с платёжной и контактной информацией. Вот обзор стандарта на ресурсе developers.google.com. Обзор реализации этого API на сайте MDN говорит о том, что Payment Request даёт разработчику браузерные средства, которые позволяют пользователям связывать предпочитаемые ими платёжные системы и платформы с интернет-магазинами. Это повышает удобство выполнения платежей за товары и услуги, ускоряя и упрощая этот процесс. В частности, например, API Payment Request позволяет пользователю ввести свои платёжные данные и адрес лишь один раз, а не вводить одни и те же сведения на каждом сайте. Выполнение оплаты на всех сайтах, поддерживающих этот API, будет выглядеть для пользователя одинаково. У API Payment Request есть и другие ценные возможности. Среди них — решение проблем с доступностью платёжных инструментов для пользователей с ограниченными возможностями, синхронизация платёжных данных между различными устройствами пользователей, стандартизированные средства обработки ошибок.

Стандартный браузерный API Payment Request - 1

Материал, перевод которого мы сегодня публикуем, посвящён демонстрации практического использования API Payment Request. Сразу же стоит отметить, что API Payment Request — это экспериментальная технология, которая вполне может измениться в будущем. Однако автор этого материала говорит, что она, несмотря на это, достойна того, чтобы с ней ознакомиться. Он уверен в том, что эту технологию ждёт светлое будущее, и в том, что изменения, которые могут быть в неё внесены, не слишком сильно повлияют на основные принципы работы с ней.
Читать полностью »

Зачем нужен микроконтроллер? Например, чтобы устроить дома пивоварню. Если своего пивного заводика мало, то можно и что-то масштабнее: построить квест-комнату, оформить презентацию, интерактивный фонтан, который рисует картину каплями, или выставочный стенд для большой компании. С микроконтроллером можно сделать что угодно — все зависит от фантазии.

Есть заблуждение, что для создания своих железок требуется знать ассемблер, C/C++, уметь управлять памятью и глубоко понимать электричество. Когда-то так и было, но технологии развиваются и сейчас для полноценной реализации своего проекта достаточно только JS!

Как поговорить с микроконтроллером из JS - 1

Ок, JavaScript мы знаем, а как соединить его с железом? Какое вообще бывает железо и что умеет? Как настроить всю систему? В расшифровке доклада Виктор Накорякова на FrontendConf узнаем: как, с помощью одного лишь JS, управлять сервоприводами, как физически объединить систему с PC, и о вариантах коммуникации приложения на JS. Обсудим пакеты serialport и Firmata, serialport с самописной прошивкой на C++, Espruino и программирование контроллера прямо на JS, Raspberry Pi, HTTP в локальной сети и HTTP и MQTT через облако.
Читать полностью »

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

Ответственный подход к JavaScript-разработке, часть 2 - 1
Читать полностью »

Среда, лексическая область видимости и замыкания в JavaScript - 1

Перевод JavaScript Environment, Lexical Scope and Closures.

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

Аналогичным образом устроена программа. То, что вы создаете снаружи — внешние функции, условные операторы, циклы и другие блоки — представляет собой внешнюю, глобальную среду.
Читать полностью »

Visual Studio Code (его ещё называют VS Code и VSCode) — это экономичный но мощный кросс-платформенный редактор кода, выполненный в виде настольного приложения. По словам автора материала, перевод которого мы сегодня публикуем, VS Code поддерживает множество инструментов разработки — вроде TypeScript и отладчика Chrome. Это, а также то, что к нему написано невероятное количество опенсорсных расширений, делает VS Code весьма популярным и любимым многими редактором.

27 удивительных инструментов VS Code для современных JavaScript-разработчиков - 1

Если вы хотите добавить в свой арсенал JavaScript-программиста что-то новое — автор материала надеется, что вы встретите здесь что-нибудь такое, что вам пригодится. Не все из рассмотренных здесь двадцати семи инструментов предназначены исключительно для JS-разработки. Но все они с успехом могут применяться теми, кто пишет на JavaScript.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js