Pull to refresh
2
0
Кирилл Агалаков @raveclassic

User

Send message

Возможно ли без Redux?

Reading time 3 min
Views 8.9K
На сегодняшний день можно найти уйму позиций, где требуется react/redux. React прекрасен, вопросов нет. Вопрос к Redux — возможно ли без него. Если погуглить чуть-чуть, найдется добротная статья на Хабре, где автор задается таким же вопросом. В статье на простом примере (todoList) метод this.updateViews() вызывается слишком часто (семь-восемь раз) и кажется, что можно сделать проще.

Основная идея тут observable models, react отвечает за observable, дело осталось за малым — создать model.

Перед созданием модели пару слов о дизайне (архитектуре) клиента:

index — raw data
history — array[model]
observer — model
view — errors, focus, flags

index.jsx — точка входа программы для экрана пользователя. Index отрисовывает все компоненты с данными по умолчанию, делает асинхронные запросы, перерисовывает компоненты с новыми данными.

// index.jsx

<History>
  <Observer>
     <HeaderView />
     <MainView />
  </Observer>
</History>
Читать дальше →
Total votes 16: ↑13 and ↓3 +10
Comments 39

Темное программирование

Reading time 7 min
Views 139K
imageПредлагаю перейти на сторону зла, на темную сторону программирования. Ситхи сильнее джедаев. И печенек хватит на всех. Предупреждаю, прежде чем начнете читать далее. Характер при переходе на темную сторону портится.
Прошу под кат
Читать дальше →
Total votes 257: ↑203 and ↓54 +149
Comments 212

За что я люблю именно Mithril (он же MithrilJS)

Reading time 6 min
Views 13K

Здравствуйте, дорогие читатели. Если вы открыли этот пост, значит, паутинная разработка переднего края (то есть, веб фронтэнд девелопмент, я хотел сказать) трогает вас за живое. И прежде, чем вы начнете кидать помидоры благодарить рассказчика, прошу дочитать… хотя бы до середины.


На написание статьи меня подтолкнули простые причины: идет война за сердца и умы разработчиков, и многие уважаемые софтверные гиганты считают своей обязанностью облегчить участь девелопера (что хорошо, кстати). При этом не стесняясь сломать ему мозг и нервную систему (а вот это не очень). Так сказать, во имя счастья будущих поколений. Может быть, я ошибаюсь, но хочу поделиться с вами информацией об инструменте, который достаточно давно открыл для себя и с тех пор не ем кактусы, как те мыши: Mithril (MithrilJS).

Читать дальше →
Total votes 23: ↑19 and ↓4 +15
Comments 19

Функциональная архитектура — это порты и адаптеры

Reading time 9 min
Views 22K
Представляю вашему вниманию новую статью Mark Seemann. Похоже, с таким количеством переводов он скоро станет топовым хаброавтором, даже не имея здесь аккаунта!

Чем интересна функциональная архитектура? Она имеет тенденцию попадать в так называемую «яму успеха» («Pit of Success»), в условиях которой разработчики оказываются в ситуации, вынуждающей писать хороший код.


Обсуждая объектно-ориентированную архитектуру, мы часто сталкиваемся с идеей архитектуры портов и адаптеров, хотя часто называем ее как-либо иначе: многоуровневой, луковой или гексагональной архитектурой. Смысл состоит в том, чтобы отделить бизнес-логику от деталей технической реализации, чтобы мы могли варьировать их независимо друг от друга. Это позволяет нам маневрировать, реагируя на изменения в бизнесе или в технологиях.

Читать дальше →
Total votes 26: ↑24 and ↓2 +22
Comments 14

Вы знаете, что такое трансдьюсеры

Reading time 6 min
Views 44K

Трансдьюсеры были анонсированы еще в далеком 2014, с тех пор по ним было написано немалое количество статей (раз, два), но ни после одной статьи я не мог сказать, что понимаю трансдьюсеры кристально ясно. После каждой статьи у меня возникало ощущение, что я приблизительно понимаю что-то сложное, но оно все равно оставалось сложным. А потом однажды в голове что-то щелкнуло: "я ведь уже видел этот паттерн, только он назывался иначе!"

Читать дальше →
Total votes 59: ↑55 and ↓4 +51
Comments 98

Путь к трансдьюсерам на чистом JavaScript

Reading time 13 min
Views 18K
Если вы наслышаны о так называемых «трансдьюсерах», но до сих пор не применяете их в JavaScript-разработке, сегодня у вас есть шанс найти ответы на вопросы: «Что такое трансдьюсеры?» и «Как ими пользоваться?». Это позволит вам понять, нужны ли они в ваших проектах, и, если нужны — поможет приступить к их использованию.



Речь пойдёт о том, как писать код, который предназначен для построения хорошо подходящих для компоновки конвейеров преобразований данных, не потребляющий слишком много памяти. Для того, чтобы как следует разобраться в концепции трансдьюсеров, начнём мы с более простых механизмов, редьюсеров, или функций для свёртки данных.
Читать дальше →
Total votes 31: ↑25 and ↓6 +19
Comments 12

Избегание ада с помощью монад

Reading time 4 min
Views 14K

Мы как программисты иногда попадаем в "программистский ад", место где наши обычные абстракции не справляются с решением ряда повторяющихся проблем.


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


Ад проверки на null


Данная проблема возникает когда несколько частичных функций (функции которые могут не вернуть значение) нужно выполнить последовательно.


Такие функции обычно приводят в глубоко вложенному и сложно читаемому коду с чрезмерным количеством синтаксического шума.


var a = getData();
if (a != null) {
  var b = getMoreData(a);
  if (b != null) {
     var c = getMoreData(b);
     if (c != null) {
        var d = getEvenMoreData(a, c)
        if (d != null) {
          print(d);
        }
     }
  }
}
Читать дальше →
Total votes 32: ↑28 and ↓4 +24
Comments 21

33 способа ускорить ваш фронтенд в 2017 году

Reading time 20 min
Views 85K

enter image description here


Вы уже используете прогрессивную загрузку? А как насчёт технологий Tree Shaking и разбиения кода в React и Angular? Вы настроили сжатие Brotli или Zopfli, OCSP stapling и HPACK-сжатие? А как у вас обстоят дела с оптимизацией ресурсов и клиентской части, со вложенностью CSS? Не говоря уже о IPv6, HTTP/2 и сервис-воркерах.

Читать дальше →
Total votes 87: ↑84 and ↓3 +81
Comments 39

Убийцы оптимизации JS уже не такие страшные

Reading time 4 min
Views 19K
Год назад я увидела перевод Убийцы оптимизации, и была удивлена тем, сколько нужно держать в голове, чтобы писать оптимизированный js код. Особенно расстраивало, что практически весь es6 попадал под деоптимизацию.


И вот новый оптимизатор в v8, называемый TurboFan, за последний год научился оптимизировать этот самый практически весь es6, es5 и даже try-catch больше не является проблемой.

class TestClass {
    megaFunc() {
        try {
            let sum = 0;
            for (let val of [1, 2, 3]) {
                sum += val;
            }
            throw new Error(`sync error, sum = ${sum}`);
        }
        catch(err) {
            return err;
        }
    }
}
let test = new TestClass();
checkOptimizationStatus(test.megaFunc);

Function is optimized by TurboFan

Что осталось не оптимизированным, а так же как проверить свою функцию на предмет оптимизации или деоптимизации буквально в 1 действие можно увидеть под катом
Читать дальше →
Total votes 61: ↑58 and ↓3 +55
Comments 71

Быстрый курс Redux + websockets для бэкендера

Reading time 30 min
Views 48K
Всем привет из 2018! Оригинальный react-redux-universal-hot-example прекратил развитие в 2017 году, но его можно собрать на версии 6.14.2, на 8 и выше версии будут ошибки. Но есть его форк
https://github.com/bertho-zero/react-redux-universal-hot-example, где продолжается разработка и поддерживаются более свежие версии Nodejs.

Это краткое руководство и обучение по фронтэнеду для бэкендера. В данном руководстве я решаю проблему быстрого построения пользовательского интерфейса к серверному приложению в виде одностраничного веб-приложения (single page app).


Основной целью моего исследования является возможность за разумное время (для одного нормального человека) получить удобный и простой в использовании интерфейс-черновик к серверному приложению. Мы (как разработчики серверной части) понимаем, что наш приоритет — серверная часть. Когда (в гипотетическом проекте) появятся во фронте профи своего дела, они все сделают красиво и "правильно".


В роли учебной задачи представлена страничка чата с каким-то умозрительным "ботом", который работает на стороне сервера и принимает сообщение только через WebSocket. Бот при этом выполняет эхо ваших сообщений (мы тут не рассматриваем серверную часть вообще).

Читать дальше →
Total votes 37: ↑33 and ↓4 +29
Comments 32

Information

Rating
Does not participate
Location
Санкт-Петербург, Санкт-Петербург и область, Россия
Date of birth
Registered
Activity