11 June 2014

Exception the good way

to catch what you really need to catch

This tip from Roman describes the common exceptions catching bad practice, which everyone should be aware of and avoid. When writing

begin
    ...
  rescue Exception => e
    ...
  end

you will catch all errors, including SyntaxError. This may be a real problem, and the broken code will run until some customer reports it. The example two files illustrate it:

bad_file.rb:

()(())

test.rb:

begin
  require 'bad_file'
rescue Exception => e
  puts "In rescue 1."
end

begin
  require 'bad_file'
rescue => e
  puts "In rescue 2."
end

When running test.rb, it prints:

In rescue 1.
test.rb:8:in `require': ./bad_file.rb:1: syntax error, unexpected '(', expecting $end (SyntaxError)
()(())
   ^
from test.rb:8

which proves that 'rescue Exception => e' style is dangerous and catches the error you would not want to be in the code.

11 June 2014

Letter opacity

because webkit is weird sometimes

There is a bug about opacity in webkit-based browsers, when using specific font family that have variable size or decorative swashes (eg. Zapfino)

If you apply opacity by following way, the first letter will be cut.

opacity: 0.5

To avoid that, you can use rgba color

color: grba($color, .5)

See for example:

See the Pen pmjdh by naiting (@sliiice) on CodePen.

11 June 2014

Bundle open

and read the source of the gems directly

Here are a couple of bundle commands I use very often:

bundle show

bundle show jekyll displays where the gem jekyll is, then I can grep there easily, or use it in a one-line:

grep -r "weird message" `bundle show jekyll`

bundle open

bundle open jekyll could directly open the jekyll gem dir with your $EDITOR, pretty useful to figure out how a gem really works under the hood.

11 June 2014

Raw SQL in Rails

for faster db manipulation

Using ActiveRecord to query and update is easy but sometimes not so efficient. If the ERD relationship is complicated sometimes it take a lot of time to get the information, or to perform the change you actually need.

In such situation, we can use raw SQL in migration to speed up the process. Such as, for example:

def change
  execute <--SQL
    update status=0 from users where id in (select user_id from groups where archived=1)
  SQL
end

Sometimes the improvement can be amazing, worth a try! (speed is usually more than 3 times faster)

11 June 2014

Parallax with Adobe Edge

in a flash kind of UI and export in html

There is a super easy solution for designer to build a parallax website. Adobe Edge Animation http://html.adobe.com/edge/animate/

Designer can set the animation in the timeline window. All skills and design experience are very similar to doing a Flash animation. The difference is that we can use Adobe Edge Animation to bind mouse event to control the timeline and the final export result support the modern browsers including mobile devices. What we need is just spend time to make a perfect (Flash) animation in Edge Animation. Export. Done.

07 June 2014

Wrap nil with try

and avoid errors

Here comes the tip from Roman, very small and probably obvious, but if you do not know about this method, it will be a nice little thing to keep in mind. When trying to call a method on a possibly nil object, we use try:

some_object.try(:some_method)

But what if you need to pass the arguments to this method? Well, it can be done with the second argument to try method:

some_object.try(:some_method, some_args)

This can be used when trying to fetch an element of a potential array:

arr = [10, 20, 30]
    arr.try(:at, 1) => 20

Note that try([1]) is wrong, you should use :at.

05 June 2014

Codemirror for mail templates

and limit user errors

Last time I talked about codemirror.js, but you may still don’t see clearly what it can help with. Here is more about how I use it.

Problem: User can edit email template body by their own. We allow them to use variables, for example {{applicant_name}}. It will be replaced to real applicant name before sending out. The problem is, this kind of tag make user feel confused and it’s very easy to make a mistype those.

Solution: We use code mirror to create our own syntax highlight, make the variable part un-editable, so people know this is variable. Because they cannot be edited, the user never makes mistake again while create variable tag.

Variable highlight

The trick here is to use, in the coffeescript file

editor = CodeMirror.fromTextArea(document.getElementById(@id), {
  lineNumbers: false,
  dragDrop: false,
  theme: 'oa'
});

editor.markText(
  cursorPosition,
  {line:cursorPosition.line,ch:cursorPosition.ch + text.length},
  {
    className: 'variable',
    atomic: true,
  }
)

You can check more about markText in the API doc at http://codemirror.net/doc/manual.html#api

04 June 2014

Git 2 push

from matching to simple

Git v2.0.0 is released

http://lkml.iu.edu/hypermail/linux/kernel/1405.3/02592.html

The biggest change is about “git push” behavior:

Before 2.0.0, the default git push is “matching” mode. It will push all your local branches to their matching ones on your remote repository when you “git push” without specifying a branch.

After 2.0.0, the default change to “simple” mode. It only pushes the current branch to the corresponding remote branch that ‘git pull’ uses to update the current branch.

04 June 2014

fs_usage debug

for js compilation

Here is a system usage command in mac terminal. fs_usage can show you all file system action, I use it for asset-pipeline debugging.

When I need check if an asset file is currently loaded, I’ll use it like

$ sudo fs_usage | grep FILE_NAME.js

It also can be used for checking how the precompilation process works. Once I used it to find a process issue of recursive compilation in the requirejs-rails gem, and reduced compilation time by 95%.

04 June 2014

Photoshop custom sharpen

with a cloned overlay

Here is a useful and easy but professional photoshop tip. Use this following step to sharpen your image:

  1. Open a photo and clone this image layer.
  2. Select Filter > Other > High Pass (3.0 ~ 20.0) to the cloned layer.
  3. Change the cloned layer type from Normal to Overlay

I usually do this before printing. It help getting a result of higher quality.

before-after