Building Resilient Systems on AWS: Learn how to design and implement a resilient, highly available, fault-tolerant infrastructure on AWS.

Tweet for Code #3

By David Walsh on June 4, 2014

You don't need a thousand lines of code to make a big difference in any coding language. Oftentimes it's quite the opposite: a few tiny code snippets can do a world of good and accomplish big things. I asked my Twitter followers to tweet to me their favorite tiny snippets of code -- that's a bit difference to try to pack into 140 characters! Here are my favorites from this round!

Anagram Check

Anagrams are cool, and I'm gonna let ya finish, but this is the smallest checker code of all time!

@davidwalshblog function isAnagram(a,b){function _(s){return s.toLowerCase().replace(/[^a-z]+/g).split('').sort().join()}return _(a)==_(b)}
— forever aloe (@potch) June 4, 2014

Text Display Optimization

Sometimes fonts don't display optimally on all devices, so let the device browser help:

@davidwalshblog html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
— Achal Varma (@_achalv) June 2, 2014

Equal Width Table Cells

We all know that tables are a pain to work with but this snippet ensures cells stay equal in width:

@davidwalshblog .calendar {table-layout:fixed;} (equal width cells in table)
— Andrew McGivery (@andrewmcgivery) June 2, 2014

Slide Title Centering

This gem from Ana Tudor vertically centers a slide title when using HTML/CSS/JavaScript slides...which you should be using! Death to Keynote and Powerpoint!

@davidwalshblog line-height: 100vh; /* for slideshows, put the title of the slide in the middle */
— Ana Tudor (@thebabydino) June 2, 2014

Floating Point Fix

Floats in JavaScript can be a pain point to those who don't already know about the issue. Here's the fix to keep in mind:

@davidwalshblog var num = 0.2*0.2; //0.04000000000000001 var fixedNum = parseFloat(num.toPrecision(12)); //0.04 Floating point problem fix
— Sergey Gospodarets (@Malyw) June 3, 2014

Closing a Browser Tab

This blog post will now self-destruct...

@davidwalshblog open(location, '_self').close();
— Alex Tkachman (@alextkachman) June 2, 2014

Until the next Tweet For Code!

Recent Features

By Eduardo BouçasJanuary 5, 2015
Write Simple, Elegant and Maintainable Media Queries with Sass
I spent a few months experimenting with different approaches for writing simple, elegant and maintainable media queries with Sass. Each solution had something that I really liked, but I couldn't find one that covered everything I needed to do, so I ventured into creating my...
By David WalshJanuary 20, 2014
5 Ways that CSS and JavaScript Interact That You May Not Know About
CSS and JavaScript: the lines seemingly get blurred by each browser release. They have always done a very different job but in the end they are both front-end technologies so they need do need to work closely. We have our .js files and our .css, but...

Incredible Demos

By David WalshDecember 20, 2010
Create Spinning Rays with CSS3 Animations & JavaScript
Thomas Fuchs, creator of script2 (scriptaculous' second iteration) and Zepto.js (mobile JavaScript framework), creates outstanding animated elements with JavaScript. He's a legend in his own right, and for good reason: his work has helped to inspire developers everywhere to drop Flash and opt...
By David WalshDecember 11, 2012
pointer Media Query
As more devices emerge and differences in device interaction are implemented, the more important good CSS code will become. In order to write good CSS, we need some indicator about device capabilities. We've used CSS media queries thus far, with checks for max-width and pixel ratios.

Discussion

Anonymous

The replace() + split() in the anagram checker can be written as match(). In Firefox 30.0:

function isAnagram(a,b){x=[for(x of[a,b])x.toLowerCase().match(/[a-z]/g).sort().join()];return x[0]==x[1]}