React component types and their combinations.

Hi volks,

Introduction

I'm sure you are aware that there are different types of components. We will not consider the implementation and purpose in detail.
Let's list them, I tried to collect all types of components, and maybe it is not all list:

  • Container Component
  • Presentational Component
  • Dumb Component
  • Smart Component
  • Stateful Component
  • Stateless Component
  • Functional Component
  • Class Component
  • Pure Component
  • Sub Component
  • Higher-Order Component (HOC)
  • Proxy Component
  • Style Component
  • Layout Component

Each type from the list above comes from different "groups".
This is a conditional division into groups for a better understanding of the issue.

Group 1: patterns

Container, Presentational, Higher-Order, Proxy, Style, Layout Components.
You can find all these patterns in https://reactpatterns.com

Group 2: by the way of implementation
  • Pure or not
    • Each Component can be Pure Component
  • Sub or not
    • Each Component can be Sub Component
  • Function or Class
    • Each Component can be Function Component
    • Each Component can be Class Component
  • Stateful or Stateless
    • Each Component can be Stateful Component
    • Each Component can be Stateless Component
  • Smart or Dumb
    • Each Component can be Smart or Dumb Component

Summary

Each Component have full name. And the full name can combine names from 2 groups above.
For example:

some "Stateless Functional Pure Presentational Component" what is "Sub Component" of "Stateful Functional Container Component".

Usually it is unnecessary to name components like that, but it's honest, every word in the name of a component describes its properties, role and place in architecture, which adds transparency at least in theory.

Thank you for attention, these were my thoughts, which came from the lack of a stricter specifications. Did anyone think about something like that?

16