DEV Community

Cover image for Tracing the Meaning of a Word: Rendering (Bite-size Article)
koshirok096
koshirok096

Posted on

Tracing the Meaning of a Word: Rendering (Bite-size Article)

Introduction

In the field of web development, Rendering refers to the process of taking information such as HTML, CSS, JavaScript, or application state and data structures, processing them, and generating or updating something humans can perceive—in other words, a screen or user interface.

Typical examples include component rendering in frontend frameworks like React, update handling via the virtual DOM, and server-side rendering (SSR). In modern web development, these mechanisms are intricately combined to deliver the final visual output to users.

At its core, the meaning of the word Rendering in this context is actually quite simple:
“Taking source materials and shaping them into a final form for expression.”

This meaning is not limited to the web. In fact, Rendering originally carried this sense long before it was used in computing.

The Etymology of Rendering

The word Rendering did not originate in the world of computers or the web.
Tracing its roots leads us to the Latin word reddere, which means “to give back,” “to give,” or “to deliver.”

From this, the English word render evolved to mean “to present something in another form” or “to express a result,” and it has been used in this sense for a long time.
For example, in the arts, render refers to depicting figures or light, while in architecture, a rendering refers to a visual representation of a finished building. In both cases, the act involves taking materials or designs and visualizing a final form.

Perhaps more surprisingly, in the fields of food processing and industry, rendering refers to the process of heating animal fat, removing impurities, and extracting usable fat.
Here, Rendering does not mean “drawing” something, but rather the process of transforming raw material into a usable form.

Rethinking Rendering in Web Development

With that in mind, let’s return to the world of the web.
At a fundamental level, rendering in web development is doing the same thing.

HTML, CSS, JavaScript, and application state are, by themselves, just text. They are not visual in the way we experience them through a browser.
They are raw materials—closer to blueprints or unprocessed information.

Browsers and frameworks interpret these materials, assemble them, perform calculations, and finally present them in the form of a “screen.”
This entire process of transformation and finishing is what we call Rendering in web development.

Taking React as an example, every time state or props change, the framework recalculates what the UI should look like.
That result is then reflected in the DOM, updating what the user sees.
Here again, the task is to transform abstract state into a concrete, usable form.

Conclusion

The reason I decided to write this article was a video I happened to watch on YouTube, explaining the process of making animal fat.
In the video, solid fat was slowly heated, impurities were removed, and high-purity tallow was produced, all while the process was explained step by step. The word the presenter used for this process was “Rendering.”

Because I work with web development and programming, I already understood the meaning and concept of render.
Still, looking back, that understanding lived mostly in my head, and there were moments where it didn’t fully feel intuitive.

However, as I watched the fat being rendered and heard that word used in that context, everything suddenly clicked.

Just as rendering animal fat involves heating solid fat, removing what isn’t needed, and extracting something usable, rendering on the web is also about processing and organizing information, then presenting it in a final, usable form.

Rendering is not merely a technical term used in web development. It is a word that has grown over a long history, carrying the idea of transformation and refinement.
Keeping that background in mind may make it feel more natural why this word is used in web development at all.

Thank you very much for reading!

Top comments (0)