Cross-editor coding style with EditorConfig

EditorConfig is a standard that helps developers define consistent coding styles between different editors and IDEs. Put a file in the root of your project called .editorconfig, and when someone opens a file in a supported text editor, the editor will adhere to the project’s style rules. There are EditorConfig plugins for pretty much every text editor. I use this plugin for SublimeText.

Drop an .editorconfig file in the root of your project:

root = true

indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

trim_trailing_whitespace = false

You can install EditorConfig for Sublime with Package Control in just a few seconds.

editorconfig - SublimeText

Getting started with Ruby on Rails

These are some of the tutorials and guides I’ve found most helpful while picking up Ruby on Rails 3.

Ruby language:

Installing Rails on Windows:

Best “my first app” walk-through:

Using “remote” to ajaxify links and forms:

“Unobtrusive JS” library that ships with Rails 3:

Use Twitter Bootstrap with Rails:

Rules for optimal web site performance

I’ve been working to improve the performance a large site at Amazon.  Steve Souders has written two excellent books that explain browser/http best practices.  A few of the rules were new to me and very helpful (flushing/mod_deflate settings, different browser techniques to defer Javascript).  The important take-away is that only a small fraction of typical page load time is bottlenecked by the server generation of a page.

High Performance Web Sites
(companion site)

  1. Make Fewer HTTP Requests
  2. Use a Content Delivery Network
  3. Add an Expires Header
  4. Gzip Components
  5. Put Stylesheets at the Top
  6. Put Scripts at the Bottom
  7. Avoid CSS Expressions
  8. Make JavaScript and CSS External
  9. Reduce DNS Lookups
  10. Minify JavaScript
  11. Avoid Redirects
  12. Remove Duplicate Scripts
  13. Configure ETags
  14. Make AJAX Cacheable
Even Faster Web Sites
(companion site)

  1. Understanding Ajax Performance
  2. Creating Responsive Web Applications
  3. Splitting the Initial Payload
  4. Loading Scripts Without Blocking
  5. Coupling Asynchronous Scripts
  6. Positioning Inline Scripts
  7. Writing Efficient JavaScript
  8. Scaling with Comet
  9. Going Beyond Gzipping
  10. Optimizing Images
  11. Sharding Dominant Domains
  12. Flushing the Document Early
  13. Using Iframes Sparingly
  14. Simplifying CSS Selectors

My first round of optimizations just went into production and our metric that measures “time from click until critical feature shows up in the browser” dropped from 5.25s to 3.5s. It’s neat to multiply the savings and see that many weeks of end-user browser load time are saved each day.

Tools for creating MacOS installer .dmgs

StepMania installer .dmg

StepMania installer .dmgI spent some time updating the StepMania MacOS installer. There are many features that you probably will want in an installer dmg:

  1. an “Applications” link or alias
  2. a custom background image
  3. custom placement of icons
  4. .dmg compression
  5. a way to script building of an installer dmg

Here’s how you’ll want to achieve the above in your installer build script

  • Create a temporary directory and copy into it all files you’ll want in your final .dmg (typically a .app or 1 directory, and maybe a documentation file)
  • Create a symbolic link (ln -s /Applications $your_temp_dir) or manually make an alias to /Applications and then copy the alias to your temp directory.
  • Use the yoursway create dmg script and pass in your temp directory, background image, icon locations, and it will spit out a compressed dmg.  Something like: create-dmg –window-size 500 300 –background background.png –icon-size 96 –volname “StepMania4” –icon “Applications” 380 205 –icon “StepMania” 110 205 StepMania.dmg ../$temp.dir.  Their script is based on the Adium installer applescript + wrapper.

You can see exactly how StepMania does it by checking out our scripts:

Useful, free tools for .Net app memory profiling

In the process of trying to slim down ChartPT‘s memory usage, I settled on these free tools:


Skip the many tutorials out there for the command line “vadump.exe” and use VMMap instead. The GUI presents information in a much more useful format (filterable, sortable).

First, check the list of loaded modules – some are explicit References in your project, others are dependencies of your references – and eliminate dependencies that you can do without.  Next, check the “Private” and “Private Working Set” columns to identify areas that you may have some control over.

CLR 2.0 Profiler –

Be sure to grab the “2.0” flavor of the profiler.  Many tutorials are old and link to the CLR 1 version of the .Net Profiler – that version won’t work with your app that builds against .Net 2.0 or newer.

Use this app to take a snapshot of your memory usage, then view allocations by object type and view allocations in a call graph.


My biggest culprit: WCF

System.ServiceModel and System.Web grab 5.5MB of private memory (14+MB of private WS on my machine) as soon as I instantiate a client proxy object.  The same things happens using built-in HTTP bindings in a skeleton console app or in the WCF test client.  The System.Web allocation could probably be eliminated by changing to TcpTransport.

Edit files directly over SFTP in Eclipse (Remote System Explorer)

I typically edit PHP and Python using VI over SSH in multiple Putty windows.  Arranging the windows is a pain, you lose all of your open shells if your connection hiccups, none of the machines I connect to provide color terminals, and I’m often fight VI’s indenting (and am too lazy to fix it on every machine).

I’ve now switched over to editing files on the server using Eclipse and the Repose System Explorer add-on.  It solves all of the problems mentioned above.

  • From Eclipse: Help -> Install New Software. “Work with: -All available sites-“. In the search box type “remote system”. Check “Remote System Explorer End-User Runtime”, click Next to proceed with the install.
  • After the wizard completed, click Window -> Open Perspective -> Remote System Explorer.  Right-click in Remote Systems, choose New Connection, type in your details.  After you connect, expand “Sftp Files” and you’ll be able to open remote files in the editor.

Thanks Ikool’s Blogbed.