10k Apart – Inspiring the Web with Just 10k

10k apart

From this article, I’ve learned about an excellent (for our times) 10k Apart competition:

With so much of an emphasis on front-end frameworks and JavaScript runtimes, it’s time to get back to basics—back to optimizing every little byte like your life depends on it and ensuring your site can work, no matter what. The Challenge? Build a compelling web experience that can be delivered in 10kB and works without JavaScript.

Think you’ve got what it takes? You have until September 30th.

I can’t wait to see the submissions and all the ways to squeeze the awesomeness of the modern web into just 10 kilobytes.  This reminds me of the Perl Golf posts over at PerlMonks and Assembly PC 64K Intro from my childhood early days (here are some examples).

Latency numbers by year

Last year I came across a nice chart of latency numbers every programmer should know.  Today, I saw this page, which shows you the same latency numbers, but also provides a timeline from 1990 to 2020.

For some operations, latency is constant, because it’s based on things of nature – speed of light, distance between continents, etc.  For other operations, latency can be decreased through better technology and algorithms.

The timeline clearly shows the mind-blowing advance we’ve experienced in technology over the last three decades.

Latency Numbers Every Programmer Should Know


I’m saving this here for current and future generations of programmers:

Latency Comparison Numbers
L1 cache reference                            0.5 ns
Branch mispredict                             5   ns
L2 cache reference                            7   ns             14x L1 cache
Mutex lock/unlock                            25   ns
Main memory reference                       100   ns             20x L2 cache, 200x L1 cache
Compress 1K bytes with Zippy              3,000   ns
Send 1K bytes over 1 Gbps network        10,000   ns    0.01 ms
Read 4K randomly from SSD*              150,000   ns    0.15 ms
Read 1 MB sequentially from memory      250,000   ns    0.25 ms
Round trip within same datacenter       500,000   ns    0.5  ms
Read 1 MB sequentially from SSD*      1,000,000   ns    1    ms  4X memory
Disk seek                            10,000,000   ns   10    ms  20x datacenter roundtrip
Read 1 MB sequentially from disk     20,000,000   ns   20    ms  80x memory, 20X SSD
Send packet CA->Netherlands->CA     150,000,000   ns  150    ms

1 ns = 10-9 seconds
1 ms = 10-3 seconds
* Assuming ~1GB/sec SSD

By Jeff Dean:               http://research.google.com/people/jeff/
Originally by Peter Norvig: http://norvig.com/21-days.html#answers

Some updates from:                      https://gist.github.com/2843375
Great 'humanized' comparison version:   https://gist.github.com/2843375
Visual comparison chart:                http://i.imgur.com/k0t1e.png
Nice animated presentation of the data: http://prezi.com/pdkvgys-r0y6/latency-numbers-for-programmers-web-development/

This is a copy-paste of this gist, referenced from this blog post. Read and share both, for the better world.

Efficient Image Resizing With ImageMagick

ImageMagick is one of my favorite tools ever.  I’ve used for years for a whole lot of different things – from simple image resizing, through animation generation, to palette manipulation.  And still, I don’t really know it that well, so when I see articles like this – “Efficient Image Resizing With ImageMagick“, I get excited.  Not only it gives you a better way of doing things, but it also explains the path of how to get there.  From a simple command like:

convert input.jpg -resize 300 output.jpg

to something as advanced as this:

mogrify \
  -path OUTPUT_PATH \
  -filter Triangle \
  -define filter:support=2 \
  -thumbnail OUTPUT_WIDTH \
  -unsharp 0.25x0.25+8+0.065 \
  -dither None \
  -posterize 136 \
  -quality 82 \
  -define jpeg:fancy-upsampling=off \
  -define png:compression-filter=5 \
  -define png:compression-level=9 \
  -define png:compression-strategy=1 \
  -define png:exclude-chunk=all \
  -interlace none \
  -colorspace sRGB \
  -strip INPUT_PATH

What’s even more exciting is that it looks like this optimization will make its way into WordPress 4.4, together with some other improvements for the responsive images.

Super cool!

What were the technical limits that Twitter reached with Ruby on Rails?

What were the technical limits that Twitter reached with Ruby on Rails?

Quora question that has some well researched answers.  This is quite handy for any system architect or web developer.

Performance improvements

Just wanted to let you all know that I’ve made a couple of changes recently, which should result in a somewhat faster performance of this site.

Firstly, before the last weekend, I’ve moved all my DNS hosting to Amazon Route 53 service.  This should result in faster DNS queries all around the globe and minimize the potential downtimes.

Secondly, I’ve installed and configured the JS & CSS Optimizer WordPress plugin, which now results in much fewer HTTP requests needed to load the page, as well as fewer bytes to be transferred around.   I’m still tweaking the settings for this one to see how much I can squeeze out of it, but I already see an improvement.

As always, if you see any issues, please let me know.