Skip to content
Open
Changes from all commits
Commits
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
13 changes: 5 additions & 8 deletions src/routes/(0)concepts/(0)components/(2)props.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -127,11 +127,8 @@ function ColoredList(props) {

## Prop drilling

Prop drilling is a term used to describe the process of passing props through multiple layers of components.
While it can be a useful pattern, it can also lead to problems.
When components are nested deeply, passing props through each component can become difficult to manage.
Additionally, this can lead to components receiving props that they do not need, unnecessary re-renders, and trouble refactoring.

Since components in Solid do not own state, props are not needed to pass state between components, but may be used.
Because of this, there may be times when you need to pass props through multiple layers of components.
A common solution to this problem is to use [Context](/concepts/context) to pass state to deeply nested components without having to pass props through each component in between.
Prop drilling refers to passing props through multiple layers of components.
While this is a valid pattern, it can cause props to become cluttered and confusing
in larger component trees, especially when intermediate components receive values they do not directly use.

When multiple components across different levels need access to the same data, Solid’s [Context](/concepts/context) API provides a cleaner alternative. [Context](/concepts/context) allows you to supply values to deeply nested components without manually threading props through each layer.
Loading