This is a big question to be answered and has to be understood properly. But one of the first questions that arise within our mind are - What is a transpiler ? Transpiler is nothing but a source-to-source compiler.

But Gautam, aren't we reading this article to find their differences ? How can a transpiler be a compiler ? Are they both the same ?

Well yes.... but no. Transpilers basically converts your code into another language which is generally much stable and widely understood by browsers (mostly ES6 to ES5).These conversions usually happen to a language which has almost same level of abstraction. For example, Typescript transpiler converts the code from Typescript to JavaScript. Babel transpiler can be used for converting ES6 JS code to ES5 JS code. But compilers are not bound to convert the code into a language with almost same abstraction , they can convert the code into any language possible. For example, Java compiler converts java file to class file.

But isn't ES6 better than ES5 ? Yes , ES6 introduced a lot of new things like modules , lexical block scoping, promises , class declarations etc. But the problem with ES6 was that most of browsers did not support it and they still do not support ES6 to this date. So to make the code more compatible and understood by the browser(s) , transpilers were introduced.

So , basically if we try to explain it in simple words for better understanding. Transpiler converts a BMW to a Rolls Royce whereas compiler is like a Genie, it converts the BMW to any car we want. And remember, when it comes to a BMW and a Rolls Royce ... everyone wants a Rolls Royce (because it's more comfortable *wink wink).

Signing off.........Godspeed !!