Как стать автором
Обновить
42.7
Карма
0
Рейтинг
Андрей Губанов @Finom

Веб разработчик

  • Подписчики 38
  • Подписки 8
  • Публикации
  • Комментарии

5 полезных плагинов для webpack

Блог компании Constanta Разработка веб-сайтов *JavaScript *Программирование *Системы сборки *
Привет, Хабр!

У webpack'а есть много полезных плагинов, о которых многие не знают и не используют в своих проектах. Под катом я собрал 5 таких, они могут здорово упростить вам жизнь!


Читать дальше →
Всего голосов 31: ↑31 и ↓0 +31
Просмотры 17K
Комментарии 5

Автоматизация квартиры с HomePod, Raspberry Pi и Node.js

Блог компании Skillbox Программирование *Умный дом Интернет вещей


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

У меня дома работает Apple HomePod, который помогает контролировать определенные системы в доме (к примеру, умные лампы) при помощи обычного запроса к Siri. Работает система как из дома, так и вне его (умный помощник есть на телефоне).
Всего голосов 33: ↑31 и ↓2 +29
Просмотры 11K
Комментарии 1

Как работает JS: абстрактные синтаксические деревья, парсинг и его оптимизация

Блог компании RUVDS.com Разработка веб-сайтов *JavaScript *
Перевод
[Советуем почитать] Другие 19 частей цикла
Часть 1: Обзор движка, механизмов времени выполнения, стека вызовов
Часть 2: О внутреннем устройстве V8 и оптимизации кода
Часть 3: Управление памятью, четыре вида утечек памяти и борьба с ними
Часть 4: Цикл событий, асинхронность и пять способов улучшения кода с помощью async / await
Часть 5: WebSocket и HTTP/2+SSE. Что выбрать?
Часть 6: Особенности и сфера применения WebAssembly
Часть 7: Веб-воркеры и пять сценариев их использования
Часть 8: Сервис-воркеры
Часть 9: Веб push-уведомления
Часть 10: Отслеживание изменений в DOM с помощью MutationObserver
Часть 11: Движки рендеринга веб-страниц и советы по оптимизации их производительности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 13: Анимация средствами CSS и JavaScript
Часть 14: Как работает JS: абстрактные синтаксические деревья, парсинг и его оптимизация
Часть 15: Как работает JS: классы и наследование, транспиляция в Babel и TypeScript
Часть 16: Как работает JS: системы хранения данных
Часть 17: Как работает JS: технология Shadow DOM и веб-компоненты
Часть 18: Как работает JS: WebRTC и механизмы P2P-коммуникаций
Часть 19: Как работает JS: пользовательские элементы

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

image
Читать дальше →
Всего голосов 25: ↑24 и ↓1 +23
Просмотры 30K
Комментарии 5

Решение, которое нужно принять, чтобы не жалеть о жизни через 30 лет

Блог компании Alconost Управление проектами *Управление персоналом *Карьера в IT-индустрии Бизнес-модели
Перевод


«Определение ада: «Тот человек, которым вы стали, в свой последний день на земле встретится с человеком, которым вы могли бы стать».
— Автор неизвестен


Читать дальше →
Всего голосов 90: ↑72 и ↓18 +54
Просмотры 116K
Комментарии 173

Делаем адаптивный HTML, добавляя одну строку в CSS

Блог компании Edison Веб-дизайн *Разработка веб-сайтов *CSS *Учебный процесс в IT
Перевод
image

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

И самое классное: адаптивность будет добавлена с помощью одной строки CSS.
Это означает, что нам не нужно загромождать HTML лишними классами (Col-sm-4, col-md-8) или создавать медиа-запросы для каждого размера экрана.

Рассмотрим все подробнее.
Читать дальше →
Всего голосов 67: ↑66 и ↓1 +65
Просмотры 153K
Комментарии 103

Эти токсичные, токсичные собеседования

Блог компании EXANTE Управление разработкой *Карьера в IT-индустрии


Всё началось, когда автор Ruby on Rails признался миру:

Всего голосов 205: ↑197 и ↓8 +189
Просмотры 102K
Комментарии 734

React медленный, React быстрый: оптимизация React-приложения на практике

ReactJS *
Recovery mode
Перевод
Tutorial

Всем привет! Хочу поделиться своим переводом статьи React is Slow, React is Fast: Optimizing React Apps in Practice автора François Zaninotto. Надеюсь, это кому-то будет полезным.


Краткое содержание:


  1. Измерение производительности React
  2. Почему ты обновился?
  3. Оптимизация через разбиение на компоненты
  4. shouldComponentUpdate
  5. Recompose
  6. Redux
  7. Reselect
  8. Остерегайтесь объектных литералов в JSX
  9. Заключение

React может быть медленным. Я хочу сказать, что любое React приложение среднего размера может оказаться медленным. Но прежде, чем искать ему замену, вы должны знать, что и любое среднее приложение на Angular или Ember может также оказаться медленным.


Хорошая новость в том, что если вы действительно заботитесь о производительности, то сделать React приложение очень быстрым довольно легко. Об этом — далее в статье.

Читать дальше →
Всего голосов 36: ↑35 и ↓1 +34
Просмотры 59K
Комментарии 59

4 вида утечек памяти в JavaScript и как с ними бороться

Разработка веб-сайтов *JavaScript *
Перевод

В этой статье мы рассмотрим распространённые виды утечек памяти в клиентском JavaScript. Также мы узнаем, как их обнаружить с помощью Chrome Development Tools.


timeline в Chrome Dev Tools

Читать дальше →
Всего голосов 98: ↑98 и ↓0 +98
Просмотры 107K
Комментарии 16

Переходим от MongoDB Full Text к ElasticSearch

Блог компании Likeastore Поисковые технологии *NoSQL *
В своем прошлом посте, с анонсом Google Chrome расширения для Likeastore, я упомянул тот факт, что в качестве поискового индекса мы начали использовать ElasticSeach. Именно ElasticSeach дал достаточно хорошую производительность и качество поиска, после которого было принято решение, выпустить расширение к хрому.

В этом посте, я расскажу о том, что использование связки MongoDB + ElasticSeach, есть крайне эффективное NoSQL решение, и о том, как перейти на ElasticSearch, если у вас уже есть MongoDB.
Читать дальше →
Всего голосов 31: ↑28 и ↓3 +25
Просмотры 27K
Комментарии 22

json-api-normalizer: легкий способ подружить Redux и JSON API

Разработка веб-сайтов *JavaScript *Node.JS *API *ReactJS *

JSON API + redux


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


Читать дальше →
Всего голосов 17: ↑15 и ↓2 +13
Просмотры 22K
Комментарии 11

Боли в руках при работе за компьютером. Часть 1: туннельные синдромы – обзор и диагностика проблем

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

image


Основная проблема в том, что для работы за компьютером используются точные мелкие движения руки в статической позе, из-за чего возникают предпосылки для повреждения сосудисто-нервных пучков на всём протяжении — от шеи до кисти руки. И часто боли в кисти руки являются следствием отдаленных проблем, не связанных с запястным каналом.
Всего голосов 24: ↑24 и ↓0 +24
Просмотры 86K
Комментарии 70

Как не ослепнуть, используя гаджеты: приложения для зрения

Блог компании VK Здоровье


Мы настолько привыкли к гаджетам, что уже не расстаемся с ними ни на работе, ни дома. Согласно докладу ВОЗ 2014 года порядка 300 млн человек в мире страдают от нарушения зрения. В частности, в России снижением зрения страдает каждый второй житель, особенно печальна ситуация у детей. Главной причиной такой тенденции становится неограниченное использование компьютеров и гаджетов. И сейчас никого не удивишь тем, что ты носишь очки или контактные линзы. В самих очках нет ничего плохого, но они — дополнительный и не всегда удобный предмет: от детского обзывания “очкариком” до проблем с походом на сеансы в 3D-кинотеатр. С линзами проблем меньше, но спросите любого, кто ими пользуется и узнаете много о мучениях, связанных с поисками линзы в глазу.

Но помимо традиционных способов коррекции зрения на помощь приходят различные приложения, помогающие взять под контроль вашу “неограниченную” цифровую жизнь и выделить время для глаз. Таких приложений сейчас множество, и мы подготовили для вас подборку из самых полезных.
Читать дальше →
Всего голосов 20: ↑18 и ↓2 +16
Просмотры 55K
Комментарии 44

Нейронные сети на JS. Создавая сеть с нуля

Блог компании EPAM JavaScript *Программирование *Алгоритмы *Машинное обучение *

КПДВ про нейронные сети


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


Но врожденные любознательность и энтузиазм довели меня до того, что я стал одним из разработчиков Synaptic — проекта фреймворка для построения нейронных сетей на JS с 3к+ звезд на GitHub. Сейчас мы с автором фреймворка занимаемся созданием Synaptic 2.0 с ускорением на GPU и WebWorker-ах и с поддержкой почти всех основных фич любого приличного NN-фреймворка.


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

Читать дальше →
Всего голосов 53: ↑51 и ↓2 +49
Просмотры 84K
Комментарии 43

Титан — колыбель жизни?

Научно-популярное Космонавтика Химия
Из песочницы
Доброго времени суток, уважаемое гик-сообщество! Представляю на ваш суд мой первый перевод и первый пост на Geektimes — «Титан — колыбель жизни?» (в оригинале — «Titan — The Abode of Life»). Оригинал от NASA здесь. В работе рассмотрены физико-химические свойства Титана с точки зрения возможности возникновения на нём метаногенных форм жизни. Канцелярит и прочие прелести старался минимизировать, но пока, по-моему, не слишком удачно. В любом случае, заинтересованных прошу под кат.


Читать дальше →
Всего голосов 82: ↑82 и ↓0 +82
Просмотры 39K
Комментарии 16

It’s the future

JavaScript *
Перевод

Этот пост просто шутка и не пытается выставить инструменты, упомянутые здесь, в дурном свете. Я использую их постоянно, они великолепны, и я рекомендую их использовать. По мотивам It's the future @ CircleCI Blog


— Эй, я бы хотел научиться писать крутые веб-приложения. Слышал, у тебя есть опыт.


— Да, я как раз занимаюсь фронтендом, юзаю пару тулз.


— Круто. Я щас делаю простое приложение — обычный TODO-лист, используя HTML, CSS и JavaScript, и планирую заюзать JQuery. Это норм?


— Не-не-не. Это олдскул. Джиквери мёртв — никто не использует его теперь! Тебе нужен React. Это будущее.


— Окей, лады. А что это?


Читать дальше →
Всего голосов 178: ↑167 и ↓11 +156
Просмотры 84K
Комментарии 287

Нейронные сети на Javascript

JavaScript *Node.JS *Canvas *Big Data *Машинное обучение *
image
Идея для написания этой статьи возникла прошлым летом, когда я слушал доклад на конференции BigData по нейронным сетям. Лектор «посыпал» слушателей непривычными словечками «нейрон», «обучающая выборка», «тренировать модель»… «Ничего не понял — пора в менеджеры», — подумал я. Но недавно тема нейронных сетей все же коснулась моей работы и я решил на простом примере показать, как использовать этот инструмент на языке JavaScript.

Мы создадим нейронную сеть, с помощью которой будем распознавать ручное написание цифры от 0 до 9. Рабочий пример займет несколько строк. Код будет понятен даже тем программистам, которые не имели дело с нейронными сетями ранее. Как это все работает, можно будет посмотреть прямо в браузере.
Читать дальше →
Всего голосов 58: ↑54 и ↓4 +50
Просмотры 141K
Комментарии 79

Быстрое клонирование объектов в JavaScript

JavaScript *Node.JS *
cloneКлонирование объектов в JavaScript довольно частая операция. К сожалению, JS не предоставляет быстрых нативных методов для решения этой задачи.

К примеру, популярная Node.JS ORM Sequelize, которую мы используем на backend-е нашего проекта, значительно теряет в производительности на предвыборке большого (1000+) количества строк, только на одном клонировании. Если вместе с этим, к примеру, в бизнес-логике использовать метод clone известной библиотеки lodash — производительность падает в десятки раз.

Но, как оказалось, не всё так плохо и современные JS-движки, такие как, например, V8 JavaScript Engine, могут успешно справляться с этой задачей, если правильно использовать их архитектурные решения. Желающим узнать как клонировать 1 млн. объектов за 30 мс — добро пожаловать под кат, все остальные могут сразу посмотреть реализацию.
Читать дальше →
Всего голосов 46: ↑43 и ↓3 +40
Просмотры 43K
Комментарии 56

24-слойный картонный дом собирается за 1 день, выдержит минимум 50 лет

Экология Будущее здесь


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

Необычные модульные конструкции для домов Wikkelhouse разработала голландская компания Fiction Factory. Каждый домик состоит из сегментов 4,5х3,5х1,2 метра, весом 500 кг, которые легко соединяются между собой. Владелец выбирает нужно количество сегментов, проектируя размер помещения.
Читать дальше →
Всего голосов 39: ↑33 и ↓6 +27
Просмотры 57K
Комментарии 249

Запуск NodeJS-приложения на Android

JavaScript *Node.JS *
Без сомнения, вам понравится запускать NodeJS на своем Android-устройстве. Благодаря эмулятору терминала и Linux-окружения для Android, разработка веб-приложений на смартфоне перестанет быть для вас проблемой.
Читать дальше →
Всего голосов 28: ↑25 и ↓3 +22
Просмотры 62K
Комментарии 12

WebPack: как внутри устроено Hot Reloading

Блог компании Voximplant Разработка веб-сайтов *JavaScript *Программирование *
Наша платформа voximplant активно использует javascript. С помощью него клиенты управляют в реальном времени звонками, на нем работает наша backend логика и большинство frontend. Javascript мы любим, ценим и стараемся быть в курсе последних новостей. Сейчас наши разработчики активно экспериментируют с перспективной связкой webpack + typescript + react (кстати, для typescript мы сделали type definitions к нашему web sdk, но об этом как-нибудь в другой раз).

Особенно нам нравится «hot module replacement»: возможность при изменении исходников очень быстро отобразить изменения в браузере без перезагрузки страницы. Выглядит как магия. К сожалению, документировано тоже как магия — по словам eyeofhell, нашего технического евангелиста, «пример на офсайте — это уникальная комбинация частных случаев и особых команд, любое изменение в которых делает его неработоспособным». На наш взгляд все не так плохо, за пару вечеров вполне можно разобраться. Но и не так просто, как хотелось бы. Поэтому специально для Хабра под катом мы максимально просто и понятно расскажем как работает под капотом вся эта машинерия.
Открыть попкорн и посмотреть шоу с эвалом и вебсокетами
Всего голосов 26: ↑26 и ↓0 +26
Просмотры 38K
Комментарии 12

Информация

В рейтинге
Не участвует
Откуда
Одесса, Одесская обл., Украина
Дата рождения
Зарегистрирован
Активность