To let you know, now you can grab TweetMute from the Chrome Web Store too. Enjoy!

Shop at Amazon and support this blog!

We’ve all been there. Do you have a friend that tweets once or twice a week, but as the playoffs gets closer, he gets a little bit talky? Maybe he gets into a flame war that doesn’t concern you (“I hate {C, PHP, Java}”); or, of course, you recorded last night’s season finale of your favorite show, and your friend can’t wait to make you nervous by stating that precise spoiler (I did that once. It feels so good when you hit the spot!).

Although I searched over and over again, I didn’t find any easy way to mute someone on Twitter, or at least find a tool that did just that the way I wanted. I normally use TweetDeck, and it’s the coolest kid on the block, but sometimes we just want to browse and read the latest news on our timeline. And as a developer, if there’s a piece of code that you really want to use, but hasn’t been written yet, you must write it. That’s what I did in the form of a Chrome Extension. Oh, and I gave it the suggestive name of TweetMute.

The usage is very simple. You open the options page, and type whatever Twitter usernames you want to mute. If you want to include their retweets too, you can. And if the time to unmute your peer has come, you can do that by just clicking on their username on the list. That’s it.

How it works? Every 1 second, it goes through your timeline and checks if there are new tweets. If there are, it verifies which of those tweets are from the annoying users you are muting, and removes them. This automatically exposes the worst case scenario: you might have to wait 1 second before the unwanted tweets disappear. Not to mention that if you mute 20, 30 users you can end up with an empty timeline. But the overall UX should be the same. It’s much better now.

I hope you’ll find it useful too. You can get the extension here.

Developer Notes:

1. Hashbangs suck.
2. You can get it or fork it from GitHub too.

Shop at Amazon and support this extension!

Time for a little fun. Here’s a video of me performing the FizzBuzz Kata a few days ago (make sure you check it out on a big screen).

Hope you don’t mind the soundtrack. And of course I’ve saved some functional juice for the end

Based on the readers of this blog, the answer is absolutely not (I also endorse this opinion). Too bad there isn’t a universal translator for code out there.

With the help of a few friends, it can surely be said that it’s no common practice to translate code to Portuguese, Russian, German or French. I managed to put my hands on the Brazilian version of Code Complete a long time ago, and only the comments were in Portuguese, for example (same thing for the French version of Crockford’s The Good Parts). I guess my professor is the only who’s translating code nowadays.

I can imagine a few reasons why code shouldn’t be translated:

• Character support. Not every programming language support the countless characters of your idiom. What to do if you intend to translate to Japanese, Korean or even Russian? Unless it’s Perl or Java, you are doomed.
• Untranslatable slang and lingo. I have a hard time translating ‘hot-swap’ and ‘pretty-printing’. Sometimes we just know what it means in one idiom, but fail to find a corresponding jargon that is still relevant and significant in another. Of course I felt better when I found out that Orson Scott Card ran into a similar problem:

  I once tried my hand at translating a story by one of the best Brazilian writers, Braulio Tavares. I got to the first sentence and was stopped cold. It was a bit of dialogue in which the main character’s father used a Brazilian idiom that simply had no translation.

  Hopefully we will always give identifiers meaningful (and perhaps lingo-free) names.

• Translation is a field on its own, and we can spoil the meaning of the code completely if we are not sure of what we are doing.

And if it’s not a standard practice, why do it anyway? Well,

• Eventually we stumble upon a code-base that is already in other language, so we ensure consistency by coding in it;
• Code that we are translating is very basic. For example, every effort to teach kids would fall into this category. (I can see a completely* localized version of Hello World!); and
• We are coding for ourselves.

But again, just because you can doesn’t mean you should actually translate code. Are you sure you want to wrap it in a black box like this? Remember that we are all forced (for the common good) to be ugly american programmers.

Oh, well… time to send an e-mail to the uninformed professor.

*except for identifiers and predefined stuff.

Yesterday I was searching through my bookmarks for a Stack Overflow question I saw a long time ago, about JavaScript being the only option for browser scripting, and realized that, along with the many, many articles sitting there, there were some really nice JS questions, not to mention their well thought-out answers, so I’d like to share them. It is worth mentioning that they are not exclusively 2010′s.

By far, the most interesting question I saw was “How could YUI3 improve its image compared to jQuery, MooTools, etc.?“, and the respective answer from John Resig, pointing out that the lack of community commits, leaving YUI completely under the umbrella of Yahoo!, along with a few other issues, is what makes YUI lag behind its competitors. Given the controversy the answer generated, Nicholas C. Zakas posted a nice follow-up on his blog.

Other questions from Quora:

• What are the main weaknesses of jQuery as a framework?
• What is the appeal of server-side JavaScript?

From Stack Overflow:

• Why require JavaScript rather than supporting a standard browser virtual machine?
• Javascript/CSS rollover menus are patented and subject to licensing?
• Why move your Javascript files to a different main domain that you also own?
• Can somebody explain this Javascript method?
• Best way to use Google’s hosted jQuery, but fall back to my hosted library on Google fail

Wikipedia states on its article about “Hello, World!“:

It is often considered to be tradition among programmers for people attempting to learn a new programming language to write a “Hello World!” program as one of the first steps of learning that particular language.

Really? Does any serious programmer willing to learn a new language tries to craft “Hello, World!” before he progresses in his findings?

We don’t do “Hello, World!” anymore. In fact, we skip one or two pages of the book, or we promptly scroll down the webpage, knowing the good stuff comes later. There was a time when where excited to see characters popping out of our screen, but no more.

Rather, we are interested in the strengths of the language. So how about an example that doesn’t abandon simplicity, and yet reveals some language secrets and endorses its syntax? We already have a winner. It’s the quicksort algorithm:

Quicksort sorts by employing a divide and conquer strategy to divide a list into two sub-lists.

The steps are:

1. Pick an element, called a pivot, from the list.

2. Reorder the list so that all elements with values less than the pivot come before the pivot, while all elements with values greater than the pivot come after it (equal values can go either way). After this partitioning, the pivot is in its final position. This is called the partition operation.

3. Recursively sort the sub-list of lesser elements and the sub-list of greater elements

I’m huge fan of the quicksort algorithm since I first heard about it at college. Computer Science is full of brilliant and simple ideas, and this is one of them (sure it has some caveats, like pivot selection, but the idea is still bright, and quicksort is blazingly fast for the vast majority of cases). Why not use it to introduce someone to your language? If I were to present you Haskell, I would definitely start with it:

qsort :: Ord a => [a] -> [a]
qsort []     = []
qsort (p:xs) = qsort lesser ++ [p] ++ qsort greater
    where
            lesser = filter (< p) xs
            greater = filter (>= p) xs

“At first, we can apply quicksort to pretty much everything that can be ordered. If we can compare two things in the sense that one ’comes later’ or ‘is bigger’ than the other, we can apply that philosophy to a bunch of those things. That’s what the first line says: We can apply our little and awesome function to a list of unordered elements and get a brand new list of these elements in the right order.

Did I say lists? In Haskell, they are kind of arrays filled (or not) with homogeneous types. In fact, they are the building blocks of a Haskell program, since we don’t have loops of any kind, but recursion.

Did I say recursion? Haskell allows it (believe it or not, there were languages that didn’t). So we can implement the quicksort in it. Let’s do it.

First out function defines what happens when we try to sort an empty list, and we can say that an empty list is already sorted. If it’s not empty we’ll take the head of that list, say p (for pivot), and put it in a special place called the ‘middle’. We filter all elements of the remaining list (xs) that are smaller than the pivot, and put them on the left of  ’middle’. The same goes with greater elements of xs on the right side. And finally, we quicksort both sides.  Eventually, we’ll call qsort for an empty list for the left, and the same for the right. This is where our recursion stops, and we have a shiny new list of ordered elements. We used pattern matching all the time. If Haskell doesn’t succeed to match a function using its first definition (in our example, empty list), it’ll try until it matches or run out of patterns (not a problem in this example).”

Man, look at the size of this code. It’s not a ‘main’, and you still have to call it from somewhere. But if we can exchange one routine for another, quicksort unquestionably has a much higher brightness per character than “Hello, World!”. Not only that, there is much more you can talk about with only this snippet, like higher-order functions and sections.

I had a class of functional programming using Haskell this semester, and before it started, I chatted with the professor about the language. He didn’t welcomed to Haskell with hello, world. Instead, he opened his editor and typed the quicksort I just presented.  I don’t remember if he was excited or not, but after I left his room, I just had to start learning Haskell. And it’s been a delightful journey so far.

You can use the same tactics to attract people to your language, too. For example, I gave a presentation with a colleague about Erlang a couple of weeks ago and surely quicksort was there! Of course, this not applies to every language, but if yours happens to have lists or eases the pain of writing plenty of code, why not replace “Hello, World!” with “Quicksort!”?

A little time ago I was pleased to know that Jeremy Keith, responsible for the awesome DOM Scripting, wrote a little book talking about HTML5. He’s such a wonderful writer that I had to read it, and I’m not disappointed.

What’s covered by the book, anyway?

Chapter 1 - It’s about HTML history until now (2010). If you are a developer for some time, you’ll already know keywords like HTML 4.01, XHTML, Tim Bernes-Lee and the like. The most important thing you get from this chapter is that, while HTML5 will become a proposed recommendation by 2022, it’s ok to use it nowadays, because every major browser is already adding support for its features (if you want, you can see how is your browser doing going here). A short and enjoyable chapter.

Chapter 2 – This chapter also starts with a little bit of history, and explains what changes at the top level of the webpages. One would expect a big doctype, for example, like it used to be in HTML 4:

Instead, in HTML5 it’s just:

That’s a good thing. Not only it’s much simpler, it’s a wise choice. HTML5 was designed to provide backwards compatibility, so existing code won’t break in any browser. This happens because the doctype is strictly related to validation – and nothing else. In other words, you can easily send HTML 4.01 or XHTML inside a document declared to be HTML5, so adding numbers to the doctype would be a waste of time. It’s the way of HTML5 to say “Memorize my tiny doctype, you won’t have to search for it every time you’re creating a webpage.” Sweet!

Finally, this chapter explains how HTML5 handles white spaces, self-closing tags, deprecated versus obsolete elements, and other goodies.

Chapter 3 – In here you’ll get to know the canvas element, for drawing and rendering shapes on the fly; and the audio and video elements, so you can use them as alternatives to a Flash or Silverlight content.

You can see what can be done with only JavaScript and the canvas element reading my post What can be built with 1kB of JavaScript?

Chapter 4 is all about Web Forms 2.0. Jeremy talks about what are HTML5 enhancements to existing elements, like required and autofocus fields, as well as new elements, e.g., date pickers, color choosers and more. In fact, you can see right now how does you browser render these new elements. If you see a bunch of text-fields, support for WF2.0 is yet to be added to your browser (are you using one of The Great Five*?)

Chapter 5, “Semantics”, shows what does it take to create semantically enriched webpages. It starts talking about microformats, an atempt to provide useful information inside class attributes. After that the chapter goes down to the nitty-gritty we expect: more HTML5 elements! You’ll learn what changes to the inline elements (now called “text-level semantics”), and are introduced to new structural elements, like nav, footer and header, intended to replace id="header", for example.

This is what a HTML5 document looks like:

Chapter 6, “Using HTML5 Today”, ends the book telling about the styling of the new elements, and provides additional resources aimed to help newcomers, and tools like Mordenizr, a JavaScript library used to detect support for HTML5 features.

In the end, you’ll get the feel that it will be extremely easy to create bad sites, since HTML5 is huge. But that’s a good thing: if you pretend to learn its inner guts and are willing to work hard on that, you’ll probably have no problems. In other words, HTML5 will separate the wheat from the chaff.
Finally, don’t be frightened by the book’s title. I’m by no means a designer, and I really enjoyed reading this book on the last saturday afternoon. It’s really short (~ 100 pages), and also a superb introduction to this much talked and poorly understood topic. It’s also really cheap, and I highly recommend it if you wanna dive into shallow waters by now, so in the future you can go really deep.

You can buy yours here.
[xrr rating=4.5/5]

*Chrome, Firefox, Internet Explorer, Opera, Safari.

Additional resources:

One of the additional resources is Dive Into HTML5, which is going to be my next stop on this topic. Also, you can read it as a book (buy it here).

A couple of days ago I asked a really simple question on Programmers – Stack Exchange. Here’s the question reproduced in its entirety:

A few weeks ago, my class was assigned to translate to Portuguese the book Real World Haskell. As I did the translation of the text and comments, I started to wonder if I should translate the code as well, as the instructor suggested. For example:

data BookInfo = Book Int String [String]
              deriving Show

would become

data InfoLivro = Livro Int String [String]
              deriving Show

Since I haven’t read any software-related books in Portuguese, I don’t know if that’s a common practice, neither if it should be done this way. In the end, the code is a language mix (perhaps the example in Haskell is not a good one, since you can create synonyms quickly like type CadeiaDeCaracteres = String, but you get the point). So it doesn’t really matter how hard you try, you’ll have to rely on the reader previous experience with some sort of basic English words.

Knowing this, I really don’t see the point in translating code, since we learn in the early days of our coding life it should be written in the universal language. Nevertheless, if the surrounding text (comments, for example, and text itself in a book) needs to be translated, what is possible and feasible in this matter? Can you provide me with some guidance of what to do?

I’d like to ask the same question to the readers of my blog, since I can reach a much broader range of developers here. So, what you think about this problem? I don’t think there’s a final and unquestionable answer to that, but your opinions will help me write an essay that I’ll present in Part II. You can leave your ideas on the comments or send me an e-mail: raphaelpfmontanaro[at]gmail.com. And if you are a native English speaker, feel free to post your thoughts, too.

Two weeks ago the winners of the js1k contest were announced at JSConf.eu. And besides them, there are 800+ submissions, splitted into three categories: not working, outdated, and up-to-date (the latter stands for enhanced versions of the outdated ones). So if you are not in the mood to face all possible entries (and waves of apps that don’t work), I’d like present a list of my personal favorites. If you haven’t heard about the contest yet, it’s a great chance to get to know what can be accomplished with so little (and acknowledge the power of minification).

To see the demos running, make sure that you are using one of these browsers:

• Firefox (>= 3.6.8)
• Safari (>= 5.0.1)
• Chrome (>= 5.0.375.99)
• Opera (>= 10.60)

Fractals

Fractals are everybody’s favorite because they are easy to implement, and still they look great.

Pythagoras tree

Pythagoras tree

Fern fractal

Fractal Fern

Mandelbrot Set

The most famous fractal, the Mandelbrot set was implemented in numerous ways and colors. Fractals are infinitely-dense, but our eyes are not sharp enough to see them completely, so the last 3 examples also provide the zoom effect.

573 bytes

1024 bytes, zoom allowed

Same 1024 bytes, with zoom

1022 bytes and zoom

3D & Visual Effects

Elastic twister effect

Organ1k

Shiny discs

Snow man

Menger sponge (also a fractal)

Games

Some classic games implemented purely on JS

3D Chess

Bubble Trouble

Tower of Hanoi

SameGame

Miscellanea

Binary clock

Langton's Ant

Bubble sort in action

Hey, look! The Reddit logo is also there

You should definitely check the winners, too. Did I miss something interesting, or do you have a different list? Feel free to share what you think on the comments.

First of all, thank you very much for the great acceptance of my first post. I wasn’t expecting so many visitors, and I’m grateful to you all for the outstanding feedback and suggestions.

Indeed one reader sent me an e-mail yesterday, telling me she couldn’t subscribe to the blog’s feed. Shame on you, mister. How did you let something like that happen to your blog? Shame on you.

As a matter of fact, the user was right. I tried without success to subscribe to the feed using Netvibes (the best reader, IMHO), my abandoned Google Reader account, and finally FeedDemon. Perhaps the user was using Bloglines, and something went wrong with their services. But hey, since Bloglines execution was delayed by one month… kudos, the problem was definitely on the site itself.

The problem

The feed on this blog is managed by FeedBurner, so I can track how many users are accessing the blog through the feed on a daily basis. The thing about FeedBurner is that you get a nice page before the subscription, showing you the options of readers you can use. Not this time, though:

How Chrome has shown the problem

Well, that’s embarrassing. If you’re like me, you hate when you reach a web page that is not supposed to be that way, especially error pages showing software-related messages, something  that’s useless to the user. To me, there’s no excuse for that behavior, be it unpredictably or not (even worse if not), and that’s why I’m sorry about it.

What could possibly be wrong? A plethora of things, I suppose, but an error on RSS is ultimately an error on XML. That’s a start. And I looked at the code of the RSS, focusing on line 87, of course. Whatever went wrong happened before (or in) that line. And exactly there, there was this HTML piece:

Problem solved. Why?

To track the blog visitors, I’ve been using both StatSurfer and mySTAT, as they keep record of different data. And as we can see, mySTAT was the source of the problem, since it somehow added HTML code to XML code, although ampersands in XML have to be encoded. That’s what the EntityRef: expecting ';' is about: it expects to read &, not just &.

mySTAT works pretty much like SpyPig, but for web pages. The plugin adds an image to the bottom of every page in the blog, so when it’s requested, the tracker receives and keeps every possibly information, for example what page was requested, by who, which browser was she using, and the like.

But why on earth would mySTAT add HTML to XML? Maybe someone ran into the same problem, so it’s time to Google for it. And what I have found is that the plugin doesn’t distinguish between a RSS feed and a HTML page. Since mySTAT was useful, but not essential, everything would return to normality by uninstalling the plugin. Two clicks and there I was. Time to reload the feed and check if it was OK.

Sadly, the error continued.

The solution

Uninstalling mySTAT didn’t  solve the problem immediately, something that was worrisome. What could I do next? This is a simple blog, running on PHP. The next easiest solution was to grep through the blog files, searching for that line, even though the plugin was dead and buried. So I started to download the blog files backup through cPanel, while I started to check via FTP if the mySTAT directory was really deleted.

"Will it blend?" - Plugins version

Suddenly, I realized that a few days ago I installed Hyper Cache to improve the blog’s performance and download times (one of the many, many things you can do in this matter, by the way). It works by adding pages to the cache… but what if it works with the feeds too?

The troublesome feed was in fact cached. Before the backup download finished, I cleared the cache, and this time, the problem was really solved.

That was it. No clue, just an insight of what could be wrong. That idea just popped up, and it saved me a little time of grepping.

Definitely my mistake, but I learned that even if you are dealing with a robust platform like WordPress, things can go wrong. The problem found in mySTAT was just maximized by Hyper Cache, so it’s our job to create software well-done, including plugins or components, since we don’t know how they are going to be used. No one likes to dive into compatibility issues. Besides that, we should fix bugs as quickly as we can, as long as they add value to our software, and prevent our users to solve the problems by themselves (and in this case, one bug was sufficient for me to remove mySTAT). That’s something the guys behind mySTAT should have learned, since this problem is well-known for a long, long time. I hope that you understand this advice before frustrating and scaring away your users, too.