Blog>
Snippets

Using Functional Components for Stateless Rendering

Give an example of a functional component which has no reactive state, no instance, and is merely a function, which can improve the rendering performance.
import React from 'react';

// Define a functional component that takes props
const Greeting = ({ name }) => (
    <div>Hello, {name}!</div>
);

export default Greeting;
This is a functional component named 'Greeting' that takes one prop 'name' and renders a greeting message. It's stateless and instance-free, making it lightweight and efficient for rendering simple output.