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

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

Введение

Обрабатывать пользовательский ввод может быть не так просто, как кажется. Мы же не хотим отправлять запросы на сервер пока пользователь всё ещё набирает свой запрос? И, конечно же, пользователь должен всегда видеть результат на последний запрос, который он отослал.

Существуют разные способы реагирования на интерактивные события в React приложениях, и, по моему мнению, реактивный подход (благодаря таким библиотекам, как RxJS или Bacon) — один из самых лучших. Вот только для того, чтобы использовать RxJS и React одновременно, Вам придётся иметь дело с жизненным циклом React компонента, вручную управлять подписками на потоки и так далее. Хорошая новость — всё это можно делать автоматически с помощью RxConnect — библиотеки, разработанной в процессе миграции с Angular на React в ZeroTurnaround.

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

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда

Дайджест свежих материалов из мира фронтенда за последнюю неделю №226 (29 августа — 4 сентября 2016) - 1

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

При написании алгоритмов зачастую возникает ситуация, когда какая-то функция нуждается в вызове с тем же количеством аргументов, но с не совпадающими типами. Решаем.
Читать полностью »

в 7:38, , рубрики: javascript, javascript p5, метки:

P5.js был создан командой Processing в 2014 году. Это JavaScript библиотека, с особым акцентом на изобразительное искусство. Цель P5.js совпадает с изначальной целью Processing — это снизить порог входа в программирование для художников, дизайнеров, учителей. С P5.js можно легко создавать бесконечно большое количество вариантов отображения информации: от веб-формата, статичных картинок для печати, до анимированных и интерактивных схем.

Processing был создан в 2001 году с целью обучить программированию непрограммистов, но с тех пор он стал основным языком для десятков тысяч художников и дизайнеров. P5.js делает рендеринг файлов PDE с исходным кодом Processing. При использовании этой библиотеки программист может вообще не знать JavaScript. Детально об отличиях Processing и p5 можно почитать в этой статье.

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

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

64-битная арифметика в браузере и WebAssembly - 1 WebAssembly активно разрабатывается и уже достиг состояния, когда собранный модуль можно попробовать в Chrome Canary и Firefox Nightly, включив флажок в настройках.

Сравним производительность арифметических вычислений с 64-битными числами в WebAssembly, asm.js, PNaCl и native-коде. Посмотрим на инструменты, которые есть для WebAssembly сейчас, и заглянем в недалёкое будущее.

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

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

image

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

Новые практические курсы по JavaScript и ES6 - 1

Привет!

Последние несколько месяцев мы в Хекслете работали над новыми курсами и обновлениями платформы. Сейчас на сайте доступно четыре "профессии", так мы называем последовательные программы обучения по разным направлениям, от новичка до джуниора. Одна из профессий окончена, а в остальных продолжают выходить новые курсы. Сегодня хочу рассказать про самое важное для нас сегодня направление — JavaScript, в частности профессию "Фронтэнд JS-программист".

Мы пошли не стандартным путем "hello world, сделаем форму, добавим анимацию, изучим ООП", а взяли за основу подход к изучению программирования в целом, а не конкретно языка JavaScript. Язык же используется как инструмент решения задач и применения изученных концепций и идей. При это мы изучаем свежий стандарт ES6 и с самого начала знакомим учащихся с правильным окружениям и техниками: модули, пакетный менеджер, отладка, модульное тестирование.

Вот как выглядит программа обучения:

  1. Жизнь программиста. Про профессию, виды компаний и виды разработки.
  2. Основы программирования. Фундамент: кодинг, ошибки, отладка, функции, побочные эффекты, типы данных. И, конечно, базовые штуки вроде чисел, строк, условий и т.д.
  3. JS: подготовка к работе. Установка и настройка окружения — node, npm, atom.
  4. JS: Составные данные. Как из простых типов данных составлять более сложные. Абстракция от чисел до объектов.
  5. Bash: Основы командной строки.
  6. JS: Последовательности. Пишем свой генератор HTML и изучаем filter, map, reduce.
  7. JS: Программирование, управляемое данными. Типы, сообщения, ООП и TDD.Читать полностью »

image

Ясной инструкции по сборке webpack для продакшена я не нашел. Поэтому решил написать эту статью. Надеюсь, пригодится. Существует множество сборщиков скриптов. Я выбрал для себя Webpack по таким критериям:

  • Гибкость настройки
  • Большое количество плагинов и лоадеров
  • Lazy loading
  • Использование es6 и es7 синтаксиса с помощью babel-loader

Из недостатков я бы выделил отсутствие ясной документации. Для тех, кто никогда не сталкивался с Webpack, я рекомендую скринкаст от Ильи Кантора. В данной статье хочу рассказать о настройках сборки проекта, написанного на React + Redux.
Я не буду углубляться в основы, а расскажу, какие плагины использую для сборки.
Читать полностью »

DiffHTML.js — утилита для патчинга DOM - 1

Что такое DiffHTML.js?

DiffHTML — эта утилита для патчинга (частичного изменения) DOM-дерева. Она умеет находить разницу между существующим DOM-деревом и HTML-строкой, между двумя деревьями. В результате будут произведены только те изменения, которые реально имеют место быть. Те элементы которых не было — вставятся, атрибуты которые были реально изменены — изменятся, и только они. Остальные элементы останутся без изменений.
Читать полностью »

Друзья, уже шесть часов вечера, последний понедельник августа, а это значит — последняя неделя лета. Давайте подведём итог и немного пофантазируем?

Сейчас формируем некий Isomorphic React App бойлерплейт на следующие 12 месяцев, с которым можно быстро стартовать новые проекты. Пока видим такой набор:

1. React 15.
2. На сервере — Node.js и Express.
3. CSS modules и isomorphic-style-loader для автоматической генерации Critical CSS при Server-side Rendering. Или всё-таки JSS? Читать полностью »


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