Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: update decomposition cheatsheet #697

Draft
wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

feat: update decomposition cheatsheet #697

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 16 additions & 3 deletions i18n/en/docusaurus-plugin-content-docs/current/get-started/cheatsheet.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,31 @@
---
# sidebar_position: 3
unlisted: true
---

# Decomposition cheatsheet

Use this as a quick reference when you're deciding how to decompose your UI. PDF versions are also available below, so you can print it out and keep one under your pillow.

## Choosing a layer
## Decomposition by necessity {#decomposition-by-necessity}
It is a common mistake to assign separate slides to the part of the code that is not reused anywhere.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue: typo, and also the phrasing is a bit unclear

suggestion:

Suggested change
It is a common mistake to assign separate slides to the part of the code that is not reused anywhere.
It is a common mistake to extract a certain part of code into a separate slice when it's not reused anywhere.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also, it's not always a mistake to extract code into a slice when it's not reused. Sometimes, large chunks of code can be extracted into layers below to decrease the size of a page, it's just that these decisions need to be taken consciously and only when the size of the page is a problem (usually it isn't)

This mistake creates several problems at once:
- The codebase becomes more disjointed, making the code harder to navigate.
- A person reading your code, seeing that a slice is not part of the page, may begin to question whether they are breaking part of the display by changing that slice.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue: it's not clear to me what "display" is

suggestion:

Suggested change
- A person reading your code, seeing that a slice is not part of the page, may begin to question whether they are breaking part of the display by changing that slice.
- A person reading your code, seeing that a slice is not part of the page, may begin to question whether this code is used somewhere else, and if they are breaking anything by changing it.

- This is a violation of basic principles such as [KISS](https://en.wikipedia.org/wiki/KISS_principle) and [Occam's Razor](https://en.wikipedia.org/wiki/Occam%27s_razor).
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion (non-blocking): I'd say it's more of a violation of YAGNI (you ain't gonna need it)


It can be avoided by following a simple rule: **"Parts of code that are not reused anywhere should be where they are used"**.

For example, we have a component that contains a block of information about a user. This component is only used on the profile page, so it should stay on the profile page.

If you are sure that your slice will be used in more than one place, you can use the note below.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion:

Suggested change
If you are sure that your slice will be used in more than one place, you can use the note below.
If you are sure that your slice will be used in more than one place, or you have another very good reason to decompose the code into the lower layers, you can use the note below.


## Choosing a layer {#choosing-a-layer}

[Download PDF](/files/choosing-a-layer-en.pdf)

![Definitions of all layers and self-check questions](/img/choosing-a-layer-en.jpg)

## Examples
## Examples {#examples}

### Tweet

Expand All @@ -32,3 +44,4 @@ Use this as a quick reference when you're deciding how to decompose your UI. PDF
- [(Thread) About the difference between features and entities](https://t.me/feature_sliced/3776)
- [(Thread) About the difference between things and entities (2)](https://t.me/feature_sliced/3248)
- [(Thread) About the application of criteria for decomposition](https://t.me/feature_sliced/3833)
- [(Thread) About decomposition by necessity](https://t.me/feature_sliced/1/106360)
15 changes: 14 additions & 1 deletion i18n/ru/docusaurus-plugin-content-docs/current/get-started/cheatsheet.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,24 @@
---
# sidebar_position: 3
unlisted: true
---

# Памятка по декомпозиции

Используйте её как быстрый справочник, когда вы решаете, как разбить ваш интерфейс по слоям. Ниже также доступна PDF-версия, чтобы вы могли распечатать её и держать под подушкой.

## Декомпозиция по необходимости {#decomposition-as-required}
Частая ошибка - выделять отдельные слайсы под ту часть кода, которая нигде не пере используется.
Данная ошибка создает сразу несколько проблем:
- Кодовая база становится более разрозненной, что усложняет навигацию по коду.
- Человек, который будет читать ваш код, увидев что какой-то слайс не является частью страницы, может начать сомневаться о том, что он сломает часть отображения, изменив этот слайс.
- Это нарушение таких фундаментальных принципов как [KISS](https://ru.wikipedia.org/wiki/KISS_(принцип)) и [Бритва Оккама](https://ru.wikipedia.org/wiki/Бритва_Оккама).

Этого можно избежать, если следовать одному простому правилу: **"Части кода, которые нигде не пере используются, должны лежать в том месте, где они используются"**.

Например, у нас есть компонент, в котором содержится блок информации о пользователе. Этот компонент не используется нигде кроме страницы профиля, поэтому его следует оставить именно в странице профиля.

Если же вы уверены, что ваш слайс используется не только в одном месте, можете воспользоваться памяткой приведённой ниже.

## Выбор слоя {#choosing-a-layer}

[Скачать PDF](/files/choosing-a-layer-ru.pdf)
Expand All @@ -32,3 +44,4 @@ unlisted: true
- [(Тред) Про разницу между фичами и сущностями](https://t.me/feature_sliced/3776)
- [(Тред) Про разницу между фичами и сущностями (2)](https://t.me/feature_sliced/3248)
- [(Тред) Про применение критериев при декомпозиции](https://t.me/feature_sliced/3833)
- [(Тред) Про декомпозицию при необходимости](https://t.me/feature_sliced/1/106360)
Loading