Tag: network

Data URL’s (aka HTML Inline Images)

Here’s a useful trick for minimizing server HTTP connections, unfortunately it’s not universally supported so you will need to provide alternate methods for non-supporting browsers (such as MSIE).

This works by placing the content of the image into the URL itself, as such there’s no need to open up a new server connection and no extra caching at any tier.

<img src=”data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub/ /ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7″ alt=”embedded folder icon” width=”16″ height=”14″ />

Free Router Firmware Upgrades

I’ve been using an old Linksys WRT-54G (version 2.0) for years, while Linksys released a few firmware updates over the years, none of them really added any new functionality. Thankfully, they had released the source code to the open-source community and several excellent releases have been made available.

Additions such as real-time monitoring/graphing, boosting wireless transmitter power, QoS (Quality of Service) and WOL (Wake-on-LAN) have been added making the router and network much more useful and valuable.

The most prominent versions are:

NOTE: There are several branches on both of these, you can read more at their respective websites.

I was easily able to update from the Linksys firmware (4.21.1) to Tomato 1.25 in only a few minutes, it was even capable of saving my existing configuration making the transition that much easier!

Happy Networking

Yahoo! Exceptional Performance (for Web Applications)

I spend a LOT of time trying to optimize web applications to run and appear as fast as possible, one of the most valuable tools I have in my “bag of tricks” is the YSlow! plugin for Firefox.

It integrates in the browser and gives a near real-time scoring of the pages you visit and suggestions on how to improve them. While some of the suggestions are not practical (for example: use of a CDN) the bulk of them can be applied to your application code or server with a little bit of work.

The rules and scoring mechanisms are well documented at the following website:

The YSlow! plugin is available here:
http://developer.yahoo.com/yslow/

Happy… Faster Surfing!

JSON – JavaScript Object Notation

Here’s another simple way to optimize code and network traffic. XML… by it’s very definition is wasteful as it exchanges size for readability. JSON is a different approach that maintains readability as well as reduces the size to a minimum. This method can be used in any client-server environment, not just between a browser and server.

JSON (JavaScript Object Notation) is a lightweight data-interchange format that is easy for humans to and machines to read/parse and write/generate. JSON is a text format that is completely language independent but uses conventions that are familiar to most programmers familiar with OO languages.

JSON is built on two structures:

  • A collection of name/value pairs. In various languages, this is realized as an object, record, struct, dictionary, hash table, keyed list, or associative array.
  • An ordered list of values. In most languages, this is realized as an array, vector, list, or sequence.

Key Concepts:

  • An object is an unordered set of name/value pairs. An object begins with { (left brace) and ends with } (right brace). Each name is followed by : (colon) and the name/value pairs are separated by , (comma).
  • An array is an ordered collection of values. An array begins with [ (left bracket) and ends with ] (right bracket). Values are separated by , (comma).
  • A value can be a string in double quotes, or a number, or true or false or null, or an object or an array. These structures can be nested.
  • A string is a collection of zero or more Unicode characters, wrapped in double quotes, using backslash escapes. A character is represented as a single character string. A string is very much like a C or Java string.
  • A number is very much like a C or Java number, except that the octal and hexadecimal formats are not used.

REFERENCES:

Cheers!

Improving network performance with server side HTTP Compression

I spend a lot of my time tweaking the performance of web applications, in addition to optimizing code it’s also necessary to verify that your server settings are also optimized for network performance to reduce bandwidth usage and thus client response times.

NOTE: This is a tradeoff between CPU and network performance, it works by compressing the content on the server just before it is sent over the wire…. when the client receives it, it then also spends some of it’s resources to decompress the content.

The Apache HTTP server provided mod_deflate (for 2.x) or mod_gzip (for 1.3).

Here’s a quick start as well as a few references:

In httpd.conf:

1. Uncomment the module:

LoadModule deflate_module modules/mod_deflate.so

2. Add the following (modify if required):

<IfModule deflate_module>
#AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript
AddOutputFilterByType DEFLATE text/*
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
#AddOutputFilterByType DEFLATE application/x-javascript

<Location />
# Insert filter
SetOutputFilter DEFLATE

# Netscape 4.x has some problems…
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine
# BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won’t work. You can use the following
# workaround to get the desired effect:
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html

# Don’t compress images or ZIP/GZ/7Z
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png|zip|7z|gz)$ no-gzip dont-vary

# Make sure proxies don’t deliver the wrong content
Header append Vary User-Agent env=!dont-vary
</Location>
</IfModule>

REFERENCES:

Cheers!