Awesome

IEEE 754 Double Precision Floating Point Visualization

It's an interactive visualization of how double precision floating point representation works.

As presented during my Everything you never wanted to know about JavaScript numbers talk at JSConf EU 2013.

Available at http://bartaz.github.io/ieee754-visualization/

Disclaimer

The code is not perfect nor pretty ;)

I was playing around with different concepts to get the idea ready for JSConf. I hope to clean it up soon.

Contributing

If you are a developer and want to help making it better, or a designer who wants to make it look prettier or you know IEEE 754 and can see some error or a field for improvement - let me know by reporting an issue, sending pull request or contact me at @bartaz on Twitter.

Acknowledgments and Resources

This tool wouldn't be possible without great work of others.

Learning resources

Everything I know about numbers in IEEE 754 representation I've learnt from resources freely available on-line.

Nearly everything about JS numbers is described in details by Axel Rauschmayer in his this series of articles about numbers, such as:

• How numbers are encoded in JavaScript
• NaN and Infinity in JavaScript
• Safe integers in JavaScript

There is of course a lot about this topic on Wikipedia. Like this Double-precision floating-point format article, or description of the IEEE 754-1985 standard.

You may also want to know what ECMAScript standard has to say about Number type.

This is also not the first attempt to provide visualisation or conversion tools between numbers and their binary representation in IEEE 754 standard.

• IEEE-754 Analysis
• float.js

Tools

Creating this visualization would be much harder without great tools such as:

• webmake by Mariusz Nowak
• CSS MathML fallback by Lea Verou
• Tangle by Bret Victor and his great work on explorable explanations

License

Copyright 2013 Bartek Szopka.

Released under the MIT License.