Transpilers vs Compilers⚙

When it comes to transpilers vs compilers, there is a world of difference between the two. As a software engineer, it is almost absolutely essential to have a firm idea about what transpilers and compilers are and this blog would help achieve the same.👨‍💻✨

Prerequisites

• Will to learn 🚀

First, let's define a few terms before getting to know about transpilers and compilers.

Abstraction

The term Abstraction will come up often in this blog, so let's define it before moving forward.

Abstraction - It refers to presenting the user with only the necessary details instead of all the implementational details.

Example📝 - We all have used a remote to operate our television sets 📺. Do we know or ever intend to know how the remote works internally while changing channels? 🙄
No right! This is an example of abstraction in real life. The remote provides us its interface beyond which we don't really need to know anything for successful operation.

Machine Code

What is machine code? 🤖

In computer programming, machine code is any low-level programming language, consisting of machine language instructions, which are used to control a computer's central processing unit (CPU) - Wikipedia

Programming languages of the likes of Java, Python, JavaScript are considered high-level programming languages as they provide a great level of abstraction to the developer. They allow the developer to worry less about intricate details and focus entirely on software development.🌈

On the other hand, machine code has very little abstraction and is not built to be best suited for development purposes.💀

Take a look at the following image for better understanding.

Next, let's move to the main part of the blog.

What is a compiler?

A compiler is a utility program that takes in our source code and generates executable machine code 🤖.

There are different types of compilers -

• Just in Time Compiler (JIT)
• Incremental Compiler
• Load and Go Compiler

and many more.

Take a look at the following image to get a better understanding of how a compiler works at a higher level.

What is a Transpiler?

On one hand, where a compiler takes source code and converts it into a lower-level language in comparison to the source code, a transpiler takes our code and translates it into something similar while keeping the abstraction level the same as before.

Example📝 - For any TypeScript code to run, it has to be first converted to JavaScript and it is done via transpiling the TypeScript source code.

Also, Babel is another transpiler used to transpile ES6+ JavaScript to more compatible forms suitable for older browsers.

The following image shows ES6 JavaScript code being transpiled to ES5 code.

Transpiling Demo 🚀

Here, we would see how a TypeScript code is transpiled to JavaScript code.

TypeScript Code

To transpile the TypeScript code we use tsc file_name.ts in the terminal. This creates a JavaScript file containing the transpiled code with the name file_name.js in the same directory.

Transpiled JavaScript Code 🌈

Conclusion

Congratulations!! 🎉🎉 You made it till the end. If you're still here chances are you probably liked the blog.🚀
Here, we merely scratched the surface of transpilers and compilers.

Do let me know how you liked the blog and where I need to improve. Would be eagerly waiting for feedback!