Многие концепции программирования существуют за пределами библиотек, в состав которых они были внедрены изначально, и иногда такой подход может сбивать с толку. Иногда мне кажется, будто не знаю, о чём говорят люди, использующие запутанную терминологию, при том что я хорошо знаю ту тему, о которой они говорят. Я написал эту статью для того, чтобы люди наподобие меня могли понять, что они знают гораздо больше, чем предполагают. Когда вы знаете концепцию, изучить её реализацию в проекте гораздо легче.
Управление состоянием
Представьте, что вы сидите в недорогом ресторанчике вместе со своими друзьями. Каждый из вас по очереди заказывает себе закуску к столу из меню. Меню в данном случае определяет, какую еду вы можете заказать. Состояние — это кухня. А официант — это управление состоянием, а вы и ваши друзья — компоненты программы.
Меню существует для того, чтобы дать вам понять, что вы не можете заказать мороженое с сардинами, потому что в таком случае все ваши друзья поломаются или как минимум перестанут с вами разговаривать.
В терминологии Redux меню представляет собой набор действий, которые можно вызвать. Официантом в данной парадигме можно считать преобразователь, который может выполнять лишь набор повторяющихся действий (детерминированных функций). Вы можете заказать шоколадное мороженое, но нельзя заказать себе мороженое со случайным вкусом, потому что в таком случае функция не сможет возвращать одинаковый результат. Официанту, то есть преобразователю, не положено думать самому. Вам нужно самим сделать случайный выбор и затем передать выбранный вкус официанту.
Компоненты
Компоненты — это как шведский стол. Каждое блюдо представляет собой полноценное самостоятельное блюдо. Вы можете положить себе на тарелку любое блюдо, а также можете вложить другое блюдо в первое. Мороженое с овощами? Без проблем. Соус карри в пицце? Конечно, почему бы и нет. Вы можете совмещать всё, что захотите, с уверенностью, что эта конструкция всё равно сработает, потому что все ингредиенты полностью автономны.
Рендеринг на стороне сервера (РСС)
Вместо того, чтобы принести вам разложенный на ингредиенты чизкейк, официант смешивает их для вас на кухне перед тем, как вынести блюдо. Это усложняет работу официанта, но помогает тем, кто не знает, как готовить чизкейк. В качестве чизкейка мы понимаем сайт, а в качестве официанта — РСС, вы же выступаете в роли браузера или поискового сервиса, который не знает, как готовить этот самый чизкейк.
Virtual DOM
И вновь представьте, будто вы сидите в ресторане и хотите заказать рис. Официант в это же время постоянно бегает туда-сюда, каждый раз добавляя в вашу тарелку по одному рисовому зёрнышку по мере готовности. Согласен, ситуация не из самых приятных. Вы подаёте официанту идею готовить всю еду на кухне, вынося вам ее с умеренной частотой. Поздравляю, вы только что придумали виртуальную тарелку! Шеф-повара — это всё то, что происходит в вашем приложении. Тарелка на кухне как бы становится виртуальной DOM, а тарелка на вашем столе — реальной DOM.
Транспиляция
Обычно, когда мы готовим, легче положить все ингредиенты в сковородку, а не держать их в руках в печи, пока они приготовятся. Однако, когда дело доходит до трапезы, ваши гости не станут есть еду из сковороды, нужно достать блюдо с помощью лопатки. Вы — повар, а сковородка в данном случае играет роль нестандартного кода, который вы пишете, лопатка работает как транспайлер, а ваши гости — браузеры.
Mobile-first разработка
Итак, вы думаете, что бы подать на стол на ужин с друзьями. Нужно угодить всем гостям, и не важно, насколько они большие или маленькие. Однако зачастую ваши гости бывают меньше, чем вы ожидали. В таком случае сначала нужно приготовить самую важную часть блюда, которую вы можете подать всем гостям, а уже затем начинать готовить что-то дополнительное для тех, кто побольше. И всё же вашим маленьким гостям не стоит подсовывать одно лишь мороженое или подавать им ужин из семи блюд.
Микросервисы против монолитной структуры
Допустим, вы делаете сэндвич, наслаивая друг на друга кусочек хлеба, немного масла, ветчину, сыр, помидор, салат и вновь кусочек хлеба. Каждый ингредиент здесь сам по себе, поэтому его можно убрать или заменить, но всё равно в совокупности они дают нужный результат. Такой сэндвич, грубо говоря, является сэндвичем на микросервисах. С другой стороны, вы можете запихнуть хлеб, масло, ветчину, сыр, помидор и салат в блендер, и тем самым приготовить монолитный смузи.
Бессерверная структура
Ого, вы решили готовить блюдо без кухни. Для этого мы убираем кухню из дома. Иной раз вы можете арендовать кухню для готовки почасово, а в некоторых других случаях вы просто заказываете ужин навынос со всеми необходимыми блюдами.
Но эта система работает не так, будто в процессе готовки нет кухни, просто она находится не в вашем доме, и вам не нужно её убирать.
Всем спасибо за внимание!
Читайте также:
- ТОП-5 признаков качественного продуктового дизайна
- Эскизы - почему они так необходимы в работе дизайнера?
- UX или UI - на что уделить внимание?
Читайте нас в Telegram, VK и Яндекс.Дзен
Перевод статьи Nicholas Heal: UI development concepts explained with food
