Обновить
256K+

JavaScript *

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

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

Умная квартира на JavaScript. От светодиода до распознавания лица в камере домофона

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

Привет! Меня зовут Антон, я ведущий разработчик в команде рекламного фронтенда ВКонтакте. Мои рабочие задачи связаны с развитием рекламного кабинета и возможностей для продвижения сообществ в приложении VK. Здесь результаты можно видеть только в браузере и телефоне, но мне давно хотелось научиться управлять объектами и в реальном мире — например, в своей квартире. Таким опытом я и хочу поделиться в этой статье: опишу, как создал и развивал свой умный дом, с какими проблемами столкнулся по ходу проекта и как их решал.

Читать далее

Метрики производительности WEB Vitals

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

Меня зовут Денис, я работаю в компании Домклик. Как вы уже догадались из названия, в этой статье речь пойдёт о таком важном элементе любого веб-сервиса, как производительность. Сразу хочу оговориться, я не буду рассказывать о том, почему это важно, в интернете уже и так очень много исследований и материалов, посвящённых этому вопросу. Я хотел бы затронуть практическую сторону этого вопроса и дать ответы на вопросы: 

Какие существуют метрики производительности?

Как оценить качество вашего приложения? 

Как поднять метрики? 

Какие инструменты позволяют оценить показатели производительности, и др. 

Читать далее

Профилирование Node.js. Доклад Яндекса

Время на прочтение18 мин
Охват и читатели10K
Полтора года назад я выступил на FrontendConf и посвятил 40 минут профилированию. Перечисленные приемы и инструменты по-прежнему актуальны — сегодня публикую видео с подробным конспектом. Доклад расскажет, что такое профилирование, научит локализовывать потенциальные утечки памяти, а также немного углубит ваше понимание инструмента DevTools.

— Всем привет. Меня зовут Артём Несмиянов, я fullstack-разработчик Яндекс.Практикума. И, как видите, сегодня я хочу рассказать о профилировании Node.js, хотя это не совсем фронтендерская тема. Но сейчас очень много приложений используют фронтбэк, где есть свой server-side rendering, где нужно это все отдавать клиенту, и фронтендеру часто приходится взаимодействовать с Node.js. Иногда происходят вещи, которые могут повлиять на ваш сервер, положить его, перегрузить и так далее. С этим надо бороться. Я хочу показать, какие методы использовали мы. Это скорее введение в профилирование Node.js.
Читать дальше →

5 альтернатив Node.js — и есть ли в этом смысл

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


Node.js — не безупречный продукт, у него есть недостатки (использование JS?), некоторые из них тянулись еще с раннего этапа разработки из-за ошибочных решений, принятых Райаном Далем, о которых немного вспомнили в статье Как создатель node.js сам разочаровался в нем. Как это часто бывает, в некоторых случаях альтернативу этой системе найти сложно или невозможно, особенно в секторе энтерпрайза. Но если не требуется поддержки большого легаси-кода, который еще много лет будут снабжать работой программистов, то можно взглянуть в сторону других решений. Про “убийцу Node.js” можно почитать в статье, указанной выше, о некоторых других будет рассказано в этой статье.
Читать дальше →

Глобальные объекты в Angular

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

В JavaScript мы часто используем сущности, вроде window, navigator, requestAnimationFrame или location. Некоторые из этих объектов существуют испокон веков, некоторые являются частью вечно растущего набора Web API. Возможно вы встречали класс Location или токен DOCUMENT в Angular. Давайте обсудим, для чего они нужны и чему мы можем у них научиться, чтобы сделать наш код чище и более гибким.

Давайте!

Дайджест свежих материалов из мира фронтенда за последнюю неделю №460 (22 — 28 марта 2021)

Время на прочтение3 мин
Охват и читатели8.4K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

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

О завершении работы Node.js-процессов

Время на прочтение9 мин
Охват и читатели29K
Node.js-процессы завершают работу по разным причинам. При этом в некоторых случаях «смерть» процесса можно предотвратить. Например — в ситуации, когда причиной остановки процесса может стать необработанная ошибка. А вот иногда с остановкой процесса ничего поделать нельзя. Например — если её причина кроется в нехватке памяти. В Node.js существует глобальный объект process, являющийся экземпляром класса EventEmitter. Этот объект, при нормальном завершении процесса, генерирует событие exit. Код приложения может прослушивать это событие и, при его возникновении, выполнять, в синхронном режиме, некие операции по освобождению ресурсов.

Существует несколько способов намеренного завершения работы процесса. Среди них — следующие:

Операция Пример
Ручной выход из процесса
process.exit(1)
Неперехваченная ошибка
throw new Error()
Необработанное отклонение промиса
Promise.reject()
Проигнорированное событие error
EventEmitter#emit('error')
Необработанный сигнал
$ kill <PROCESS_ID>

Многие из этих операций часто выполняются случайно, например — это касается неперехваченных ошибок и необработанных исключений. Но одна из них, с которой мы начнём разбор причин завершения Node.js-процессов, была создана с целью дать разработчику возможность вручную завершать процессы.
Читать дальше →

Семилетними шагами: миграция с JSP + Angular JS на Angular 2+

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

Что нужно для перехода от серверного рендеринга к пользовательскому? Чем хорош Angular 2+ и как на него перейти?  В этой статье попытаемся разобраться в данных вопросах и описать процесс миграции от серверных технологий рендеринга, таких, как JSP, к клиентским технологиям рендеринга представлений с использованием Angular.

Читать далее

Javascript and Rocket Science

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

Я уже два с половиной года пишу на Js, и почти повсюду вижу примеры решения типовых задач для этого языка . Отрисовать очередную онлайн-витрину, подать асинхронный запрос на бек за очередным JSON. Уровнем повыше - построить структуру данных для SPA и на ее основе отобразить визуальные компоненты. Но в Js есть полноценная библиотека математических функций, он обеспечивает неплохую для скриптового языка скорость вычислений (здесь сравнение производительности по бенчмаркам Питона vs Node ), так что почему бы не попытаться сделать еще один шаг и не решить с его помощью какую-нибудь инженерную задачу. Например - из космической области.

Выйти в космос

Оптимизация графики в Voximplant Kit

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

Что делать, если сценарий крутой и сложный, но из-за этого начинает тормозить? Данным вопросом задались наши разработчики Voximplant Kit и придумали функцию оптимизации. Продолжая серию обновлений Кита, расскажем, как оптимизация заставила большие сценарии летать и с какими проблемами мы столкнулись в процессе её создания.

Полетели!

Еще один подход к построению архитектуры на фронте

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

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

В рамках статьи я постараюсь просто рассмотреть и дать ответы на следующие темы:

что такое архитектура и почему она должна быть чистая;

как написать архитектуру, которая основана на сервисах;

пример построения архитектуры для приложения заметок;

интеграция архитектуры с реактом.

Читать далее

Passport.js + mongoose объединяем две коллекции

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

Добрый день! Решил поделиться своими небольшими достижениями в использовании популярной библиотеки Passport.js. Задача была такой: использовать две локальные стратегии passport.js при том, что пользователи находятся в двух разных коллекциях Mongo Atlas.

Итак, дано: две коллекции пользователей в Mongo Atlas, и две локальные стратеги в Passport.js.

Задача, реализовать аутентификацию учителей по логину и паролю, учеников по Фамилии и номеру класса. Тут кстати в вопросе за одно и объясняется, почему мы используем две локальных стратегии, именно потому, что способы идентификации пользователя разные (учителя- логин/пароль, ученики - Фамилия/класс).

Читать далее

Apollo GraphQL React Social App

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


Доброго времени суток, друзья!

В поисках вдохновения наткнулся на этот замечательный туториал, посвященный разработке «социального» клиент-серверного приложения на MERN + GraphQL.

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

Код проекта находится здесь.

Основные возможности приложения


  • Регистрация/авторизация пользователей
  • Добавление/удаление постов
  • Лайк/дизлайк постов
  • Добавление/удаление комментариев к постам
  • Отображение количества лайков и комментариев

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

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №459 (15 — 21 марта 2021)

Время на прочтение3 мин
Охват и читатели8.7K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

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

Рендеринг шрифтов для WebGL при помощи инструмента msdf-bmfont-xml и технологии MSDF

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

18/3/2021 Наконец-то была закончена интеграция инструмента msdf-bmfont-xml для библиотеки openglobus. Текстовые метки стали выглядеть гораздо красивее! Мне помог инструмент msdf-bmfont-xml для создания атласов шрифтов и рендеринга текстур для (multichannel signed distance fields) MSDF.

Читать далее

Делаем интерактивный Big Mac Index на React и Quarkly

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

Привет! Для начала процитирую страницу из Википедии, да будет здоров Джимми Уэйлс и все редакторы, поддерживающие свободную энциклопедию. Согласно ней, индекс бигмака — это неофициальный способ определения паритета покупательной способности. Если проще, этот индекс довольно наглядно показывает уровень цен в стране, ведь в основе стоимости бигмака: две мясных котлеты гриль, специальный соус, сыр, огурцы, салат и лук, всё на булочке с кунжутом… Кроме этого, конечно же, в ценник заложены аренда помещений и оборудования, рабочая сила и многие другие факторы.


Важно и другое: милые сердцу многих рестораны с желтой буквой «M» имеют обширнейшую сеть, что дает возможность сравнить цены почти по всему миру. Исследования ведутся с 1986 года и постоянно актуализируются журналом «The Economist».


Мы визуализировали имеющиеся в свободном доступе данные и собрали простое приложение, используя React и наш проект Quarkly.



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

Фреймворк Webix Jet глазами новичка. Часть 1. Композиция и навигация

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

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

Узнать подробнее

Шпаргалка по функциональному программированию

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

Привет, меня зовут Григорий Бизюкин, я преподаватель Школы разработки интерфейсов и фронтенд-разработчик в Яндексе. Давайте поговорим о функциональном программировании в мире JavaScript. Мы все про ФП что-то слышали, нам всем оно интересно, но у меня, когда я искал полезные материалы для подготовки к лекциям, сложилось такое впечатление: есть куча статей, каждая из которых либо говорит об ФП общими словами, либо раскрывает отдельный маленький кусочек темы, чего, конечно, недостаточно.



Добавим функционального света


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

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

Юридически значимый электронный документ (для РК) из веб формы без серверного кода

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

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


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

В качестве приятного бонуса — возможность получать подписанные ЭЦП документы на электронную почту.


Речь будет идти о сертификатах ЭЦП, выпущенных НУЦ РК.

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

Argumentum ad ignorantiam

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


Успел прочитал переводную статью «5 фактов о том, как Microsoft приватизировала открытый исходный код, убивая JavaScript в процессе». «Успел прочитать», потому что статью сразу безбожно заминусовали (через 30 минут уже было -12), а сейчас статья вообще скрыта в черновиках.

Её основная мысль была «Миссия Microsoft – так или иначе превратить каждого JavaScript-разработчика в дрон Microsoft TypeScript, приносящий деньги» за счет того, что «Microsoft внедрила использование TypeScript в React, Angular и Node, одновременно приватизировав Github и npm».

По мнению автора, именно для этого Microsoft купила Github, пакетный менеджер Npm (который является менеджером пакетов для NodeJS), а так же всячески продвигает свой VSCode как единственный редактор кода для TypeScript. И хотя все приведенные факты в статье имею место быть, но сам стиль подачи материала выглядит классической страшилкой из области теории заговоров, причем написанной человеком, который всей душой искренне любит JavaScript и ненавидит Microsoft.

Наверно я так и прошел бы мимо, если бы сам немого не кодил на JavaScript, и не по наслышке знаю ту боль, которую может причинить разработчику отладка на не типизированном языке. А ведь это одна из многих проблем, которую по задумке и предназначен решать TypeScript. Если бы не одно но…
Читать дальше →