With "attaching an event handler once" you possibly mean one of these two things:

Register a function for an event, and discard it once that event has happened

Use one instead of on.

$(element).one('eventName', function() { ... });

It has the same API has on.

When code is run multiple times that registers a function for an event, do that only once

With jQuery, you can de-register callbacks. You can use that to achieve registering a function only once.

function myAction() { ... }; // defined somewhere globally o...

Note

This card does not reflect the current state of lazy loading technologies. The native lazy attribute could be used, which is supported by all major browsers since 2022.

Since images are magnitudes larger in file size than text (HTML, CSS, Javascript) is, loading the images of a large web page takes a significant amount of the total load time. When your internet connection is good, this is usually not an issue. However, users with limited bandwidth (i.e. on mobile) need to mine their data budget...

There are many solutions, but a very concise one is this:

hash.merge!(hash) do |key, old_value, new_value|
  # Return something
end

The block of merge! will be called whenever a key in the argument hash already exists in the base hash. Since hash is updated with itself, each key will conflict and thus allow you to modify the value of each key to whatever you like (by returning old_value you'd get the behavior of Rails' reverse_merge!, by re...

Quick steps

1. git rebase -i -> mark your commit with edit
2. git reset HEAD~ (remove the marked commit, but keep its changes)
3. Make several commits (optionally setting the previous author manually)
4. git rebase --continue

Detailed instructions

Basically, you will review the last n commits and stop at the splittable commit. Then you'll undo that commit and put its changes into new commits at your liking.

1. Review commits (rebase)

   git rebase -i HEAD~3
   # or
   git rebase -i origin/master
   

   ...

One useful postgres command I stumbled upon recently was \x. It gives you an expanded display which allows you to actually read the results of your select * from queries. The link below describes a few more useful techniques and commands.

You want to test your 1GE or 10GE internet uplink? We needed to ensure we have full 10GE to the backbone for a customer project.

Using netcat

To test whether we can achieve the bandwidth internally, you can use netcat and dd like this:

On your first server: nc -v -l 55333 > /dev/null
On your second server: dd if=/dev/zero bs=1024K count=5000 | nc -v $remote_ip 55333

You should see some output like this:

user@xxx:~ % dd if=/dev/zero bs=1024K count=5000 | nc -v removed 55333
Connection to 91.250.95.249 55333 port [...

When dealing with AR scopes, you can remove conditions, order, etc by using the unscope method.

It is available on Rails 4+.

Examples

Consider an exemplary User class as follows. For the examples below, we will use a scope that applies all its constraints.

class User < ActiveRecord::Base
  scope :active, -> { where(locked: false) }
  scope :admins, -> { where(role: 'admin') }
  scope :ordered, -> { order(:name) }
end

users = User.active.admins.ordered

^
SELECT "users".* FROM "users" WHERE "use...

Redactor is yet another WYSIWYG editor. It definitely has its weak points, but I want to point out that it has clear strengths, too.

Pro

• Simple and beautiful interface.
• Outstandingly organized source code. Have never seen a JS library that was this structured.
• Clear, comprehensive and searchable API documentation. Filled with code examples.
• Easily customizable: specify toolbar buttons, pass various callbacks, etc.
• Features a collection of great [plugins](ht...

PostgreSQL's array data type is pretty useful, but manipulating values of arrays can be awkward because of its syntax.

Consider the following users table which each example below will start from:

(PostgreSQL uses curly braces to represent arrays, true story.)

Adding values

Use the array_cat function, or the || operator.

These calls will add the values "cats" and "mice" to use...

Rails 4 introduced raising an error on pending migrations. This is most annoying when you are crafting a migration but need to play with your application to figure out how to do it.

To disable this behavior, just set the corresponding config option to false:

# in config/environments/development.rb

# Raise an error on page load if there are pending migrations.
config.active_record.migration_error = false # was :page_load

Web fonts are great. They are also be really bad for front-end performance because they block rendering. You may have experienced this on a slow cellular network. Staring at a blank page is no fun, especially when the content has already loaded.

This talk explores why browser have placed fonts on the critical path, and how we can work around this while still delivering a good user experience. It also takes a look at what the future will bring to web font performance: preloading hints, the font-display property, and HTTP/2.

Our applications not only need to be functional, they need to be fast.

But, to quote Donald Knuth,

premature optimization is the root of all evil (or at least most of it) in programming

The reasoning is that you should not waste your time optimizing code where it does not even matter. However, I believe there are some kinds of optimizations you should do right away, because

• they are either obvious and easy
• or they are very hard to do optimize later

This is an attempt to list some of those things:

On the server

...

This is a guide on how to effectively use Git when working on a feature branch. It is designed to get out of your way as much as possible while you work, and ensure you end up with clean commits in the end.

We assume you are the only person working on this branch. We also assume the branch has never been "partially" merged into master.

You want to start a feature branch

git checkout master
git checkout -b my-feature-branch
git push -u origin my-feature-branch

You've added code that works ind...

Starting with Ruby 1.9, most #each methods can be called without a block, and will return an enumerator. This is what allows you to do things like

['foo', 'bar', 'baz'].each.with_index.collect { |name, index| name * index }
# -> ["", "bar", "bazbaz"]

If you write your own each method, it is useful to follow the same practice, i.e. write a method that

• calls a given block for all entries
• returns an enumerator, if no block is given

How to write a canonical each method

To write a m...

Rails 5 will introduce ActiveRecord::Relation#or. On Rails 4 and 3.2 you can use the activerecord_any_of gem which seems to be free of ugly hacks and nicely does what you need.

Use it like this:

User.where.any_of(name: 'Alice', gender: 'female')

^
SELECT "users".* FROM "users" WHERE (("users"."name" = 'Alice' OR "users"."gender" = 'female'))

To group conditions, wrap them in hashes:

User.where.any_of({ name: 'Alice', gender: 'female' }, { name: 'Bob' }, { name: 'Charl...

When working with PostgreSQL, you can use pgAdmin as a GUI.
While you can do most things just like on an SQL console, you can use it to display EXPLAIN results in a more human-readable way.

(image from the Postgres manual)

1. Open up pgAdmin, connect to your server
2. Pick a database from the left pane
3. Click the "SQL" icon in the toolbar, or press Ctrl+E to open the query tool.
4. Paste any queries that you'd like to explain.
5. Go to "Query" → "Explain analyze", or ...

To safely transport an arbitrary string within a URL, you need to percent-encode characters that have a particular meaning in URLs, like & or =.

If you are using Rails URL helpers like movies_path(:query => ARBITRARY_STRING_HERE), Rails will take care of the encoding for you. If you are building URLs manually, you need to follow this guide.

Ruby

In Ruby, use CGI.escape:

# ✅ good
CGI.escape('foo=foo&bar=bar')
=> "foo%3Dfoo%26bar%3Dbar"

Do not ever use `URI.en...

As the web is being used for more and more tasks, expectations rise. Not only should web pages offer rich interaction, they must be responsive in both size and interaction.

This imposes a paradoxon that needs to be solved by building performing applications. It's not enough any more to have your web site do crazy stuff, it is also required to do it crazy fast. This card is intended to give you an introduction to this emerging aspect of web development.

Read this introductory [performance study on Pinterest](http://www.smashingmagazine.com/...

We organize our daily work with issues in our Linear workspace.

Issue format

A good issue needs to be precise. It should be very clear what is part of an issue, and what is not. If there are different expectations between the person who writes and who implements an issue, there will be rejects.

To this end, we use a consistent format for issues that looks like this:

Issue: Autocomplete

As a journalist, I want to have an autocomplete in the search bar, to have a more efficient way to find articles.

Acceptance criteri...

When working on a bigger project, the easiest way to improve your work relation with a client or an external product manager, is to make sure you see them in person once in a while.

It makes sense to meet each other when you start working together to establish a relationship and find out what makes them tick.

If you need to discuss a larger package of work, use the opportunity and meet up and discuss it in person.

When you have to discuss something in your daily work, prefer talking to writing, and consider using a webcam.

It smells. Rethink your code design.

Code example with makandra/has_defaults:

class Post < ActiveRecord::Base

  has_defaults tags: []          # field in db
  has_defaults virtual_tags: []  # no db field
  
  def all_tags
    virtual_tags + tags
  end
  
end

> Post.new.virtual_tags
=> []   # ✔

> Post.find(1).virtual_tags
=> nil   # ☹

> Post.find(1).all_tags
=> Error: undefined method '+' for nil:NilClass

Unfortunately, Web APIs haven’t provided the functionality to copy text to the clipboard through JavaScript, which is why visiting GitHub with Flash disabled shows an ugly grey box where the button is supposed to be. Fortunately, we have a solution. The editor APIs provide document.execCommand as an entry point for executing editor commands. The "copy" and cut" commands have previously been disabled for web pages, but with Firefox 41, which is currently in Beta, and slated to move to release in mid-September, it is becoming available to Ja...

Spreewald comes with a selector_for helper that matches an English term like the user's profile into a CSS selector. This is useful for steps that refer to a particular section of the page, like the following:

Then I should see "Bruce" within the user's profile
                                 ^^^^^^^^^^^^^^^^^^

If you're too lazy to manually translate English to a CSS selector by adding a line to features/env/selectors.rb, we already have an [auto-mapper to translate English into ...

I am happy to announce that this information is now available in JSON form at https://ip-ranges.amazonaws.com/ip-ranges.json. The information in this file is generated from our internal system-of-record and is authoritative. You can expect it to change several times per week and should poll accordingly.