Image
This section provides an overview of how DocuBook handles images in Markdown.
In DocuBook, all images written in Markdown are automatically converted to their respective Next.js components. This allows for better optimization and performance in your application.
Images
Similarly, images in Markdown are transformed into the Next.js Image
component. This allows for automatic image optimization, such as lazy loading and resizing, which enhances performance and user experience. Here’s an example:
Markdown

Rendered Output
The above Markdown is converted to:
<Image
src="https://via.placeholder.com/150"
alt="Alt text for the image"
width={800}
height={350}
/>
Benefits
- Performance Optimization: Automatic conversion to Next.js components ensures optimized loading of images.
- Responsive Images: Next.js
Image
component handles responsive images, providing the best quality for various device sizes.
By utilizing these features, you can ensure that your documentation is not only visually appealing but also performs efficiently.
Published on Dec 14, 2024