(In case you are wondering, ELI5 = Explain Like I am Five.)

Big-O what?

In computer science we have the Big-O notation. It is a way to compare the complexity of an algorithm. An algorithm is defined by the how the code solves a problem and we want an algorithm that is fast. For programmers, sometimes it is useful to understand the concept of Big-O thoroughly to produce some examples in code.

To explain what the Big O notation is, let us do some simple algebra.

As we all know, in math, the most basic operations are:

• addition
• subtraction
• multiplication
• division

How does it work?

Say we have two numbers – 12345 and 56789. Since primary school if we were to add those two numbers up, we would first line the numbers up to the right then add each digits in the column from right to left. If each column exceeds 10, we add 1 to the left.

 12345
+56789
-------
 69134

The number of steps we take is about 5+ (including carrying 10 over). This means adding two 5 digits number takes about 5 steps.

What if we add two 10 digits number? That would take about 10 steps. Two 1000 digits number? 1000 steps.

So we can see a linear pattern here as the problem gets bigger. The complexity is directly proportional to the number of problem/digits (n digits) that we need to add up. Hence for an addition operation, we have a linear complexity. Or as we denote in the Big O notation, O(n).

The same complexity applies to subtraction as well.

For the case of multiplication, that is not linear though. The complexity of a multiplication operation is said to  be quadratic, O(n²). This is because for multiplication what we usually do is line the numbers up and multiply each numbers one by one. Then we add them up then move on to the left. So for multiplication two 6 digits number, we need to do 36 multiplication steps plus 10 or 11 additions to ge the end results.

As the problem gets bigger (more n digits), say multiplying two 100 digits numbers, we need 10,000 multiplication + 200 additions. Imagine if it gets really really big say 1 million digits. The multiplication steps will surely be even bigger while the additions could be big, but note that at this point, the additions step are now negligible. Which is why we said multiplication is a quadratic complexity O(n²).

This is another important part of the Big O notation. We only care about the significant portion of the complexity and algorithm.

Why do I need to know this?

The reason why we care about the Big-O notation and the complexity of the algorithm is because this affects the real world in a lot of ways. We always want to find the best case to use to search for answers in the fastest way. Not to mention saves up cost of computational power, resources and cost.

Finally, the two examples given only scratches the surface of the Big O notation. We still have in our hands the logarithmic complexity, constant complexity and factorial complexity which I will leave you guys to research more if you are interested in the subject of algorithm and optimization.

For a visual explanation on Big O, you can watch this video here.

(Image thanks to Sasa.)

The post ELI5: The Big-O Notation appeared first on Stampede: the strategic design & technology company.

Quoting a blogpost about a research:

Researchers led by Dr. Gitte Lindgaard at Carleton University in Ontario wanted to find out how fast people formed first impressions. They tested users by flashing web pages for 500 milliseconds and 50 milliseconds onto the screen, and had participants rate the pages on various scales. The results at both time intervals were consistent between participants, although the longer display produced more consistent results. Yet, in as little as 50 milliseconds, participants formed judgments about images they glimpsed. The “halo effect” of that emotional first impression carries over to cognitive judgments of a web site’s other characteristics including usability and credibility.

Try clearing your browser cache and refresh your website, how long does it take to fully load? 2 seconds? 30 seconds?

If you are running a business on your site, potential customers might have already been turned off by the page load time. This might affect sales.

So what can you do to speed up your site?

Thankfully, there are a lot of great tools and solutions out there to help you optimize your site. For this post, I’ll introduce three techniques that I know of.

Use a Content Delivery Network (CDN)

Traditional server architecture is having your web hosting provider’s server serve up your website to the world wide web. Your website might load fast for users located near the server. But what if your most targeted customers or users span all across the other continents?

This is where CDN comes into play. CDN is a delivery network service. It is a service provider whereby they allow you to cache your site on their network of servers, at an affordable cost (some comes free) all over the world.

Big boys’ sites like Google and Facebook have the power and funds to buy servers and have them setup personally all across the world. For personal or small business sites, CDN services are the way to go. Now you do not have to worry about choosing a hosting provider that is closer to home.

These CDN services also come with additional perks like analytics and security. Some claimed that the analytics data are more accurate than script-embedded services because CDN are the ones that serve the site. Also, you are protected up to the latest threats since your site is under their wing of networks.

Minify all the things!

It is okay for your source code to have proper indentation and spacings during development phase. But in production environment, you’d better off getting your source code and asset files like CSS and javascripts minified to reduce their file size down to a significant level. This will not only save you on bandwidth cost but also speed up the site for first time visitor.

It is also advisable not to change your source code too often in production environment because visitors will have to load up new versions of the source code each time you make a small change. So unless we are talking about critical bugs in the site, update the site by a huge batch of changes. Make use of the browser caching ability.

Analyze your site and further improve

There are a couple of tools out there that can help you analyze your site and suggest ways on how to improve your site like Yahoo!’s YSlow. For me I use Google’s PageSpeed extension. Install it and start analyzing your site today – it is free. I was able to score up to 99/100 points in my recent optimization attempt.

The one point missing is from third party fonts that I have no control on improving.

One thing to note is that even though the analyzer is a great way on improving your site, you still need to consider each suggestion that were thrown at you carefully. Each site is built differently so 100 points should be an ideal target but not a must-attainable score.

That is it!

With the three solutions that I suggested, that should give you a general idea on how and why you should speed up your website. If you have any other alternatives, do comment below. I would love to hear about your optimization techniques. Best siot!

The post Speed Matters appeared first on Stampede: the strategic design & technology company.

I must admit, keyboard is still the only input device where I can always feel the satisfaction of conveying what I want to say onto the computer screen. No, I’m not talking about touchscreen keyboard on your smartphone but a real tactile, button-ful keyboard.

Nothing beats a generic keyboard. Just ask yourself this, when was the last time you type flawlessly on a touchscreen keyboard? Autocomplete or swiftkey is a supplementary to its flaw, not a complementary.

In my line of work as a programmer that deals with the text editor, the keyboard plays a major role in churning out thousands and thousands of lines of code. So having a good keyboard is vital to my performance and a great keyboard can saves me a lot of time.

Why time? That’s because typo. Typos are irritating. You may say that fixing a typo only takes a few seconds, but did you know that on average we spent hours per year fixing our own typo? Not to mention that typo kills the train of thoughts too.

The reason why I used the word ‘satisfaction’ previously to describe my typing experience is because typing can become an ecstasy when you are typing long sentences or paragraphs in one go with your train of thoughts are not being blocked or annoyed by typos. The click-clack sound the keyboard makes can become white noise for diving into your subconscious.

My preciousss

The keyboard that I am using currently is a mechanical keyboard and I recommend that you get one if typing is your business. Note that commercial keyboards all come with dome-switch while mechanical keyboards come with mechanical switch. I won’t go into the technical details but here is a short summary of why you should get a mechanical keyboard:

Actuation

Actuation is the amount of force that you have to exert on the button for a key to register as typed. The problem with commercial keyboard is that each different buttons have different actuation. Imagine putting different strain on your fingers after a long day of typing. That will be very tiring. Now for mechanical keyboard, the switches are consistent across the board. After using mechanical for awhile, you will be  able to feel the difference with dome-switch keyboard requiring more stress trust me.

Faith & Durability

Do you trust your keyboard? I am assuming that you readers out there type by looking at the screen instead of the keyboard. So, when you press that long ‘Shift’ key, the spacebar, backspace, or even the ‘Enter’ key do you trust it to register? If your keys sometime got stuck halfway when you’re hitting it, that means it’s time to change the keyboard. Dome-switch has an expected lifespan of 5-10 million hits while mechanical switches have a life expectancy of 50 million hits. We’re talking per key here. So if you are doing frequent typing on a commercial keyboards, you need to change one after one or two years. Investing in a mechanical keyboard isn’t that bad now isn’t it?

Key Rollover (NKRO)

This advantage is more to gamers. With key rollover feature, you will be able to press just about as many keys as you want on your keyboard and they will all register as once as compared to commercial keyboards where they only allow two to three keys at a time.

Sound

This could be a disadvantage for some people but for me, the sound that mechanical keys make is zen. It makes typing much more fun and it helps with the faith point that I mentioned – my ears act as a way to tell if a key has been typed or not. Also it’s one of the reason why purist typists are still using those ancient typewriter with a ding!

However, the sound might be annoying for people near you, but fret not as there are a lot of different mechanical switches out there, some are more quiet. So choose your flavour wisely. Note that you can even mod some dampeners to reduce the sound but I’ll leave that for you to discover yourself.

So that’s about wrap it up, tell me, are you considering a mechanical keyboard now? If you are already hooked onto one, how is your experience so far? I’d love to know. 🙂

(Top photo credit: Zen Garden)

The post Click-clack-ding! appeared first on Stampede: the strategic design & technology company.

Time tracking software is essential in the web business. Every ticking second could mean cost and revenue for us developers or the clients. We don’t want to overcharge our clients nor do we want our tracked hours to be lost in space. Hence two important rules for a time tracking app are that it must have both reliability and stability.

First page of Toggl. In-your-face and straight to the point. One click and start working.

I was working as usual with Toggl running a few months back and suddenly its load balancer suffered, causing my tracked tasks to fail when submitting to the server. I tried to submit a few more times only to find out much later at the end of the month that multiple entries had been inserted. Client was almost billed for the same tasks multiple times. That, my friend is credibility and trust lost on Toggl. Lesson learned.

I decided to give Harvest, a simple online time tracking software a try. The mission is to find out if it is a worthy opponent to Toggl, the one that we have been using for the company all these time.

So what are my first impressions and what do I think about Harvest after a week of mild usage?

First page of Harvest. Clean and informative, but at least 3 clicks to get the timer going.

First of all, the dashboard on Harvest isn’t really that dashy at all. You have to click at least 2-3 buttons to get the timer to start. I like Toggl’s in-your-face interface more where the first screen is everything you’ll want to do – start timer and work instead of clicking which task, add entry, etc.

The other functionality on Harvest like reports, invoices and estimates are definitely much better and cleaner. I feel that the reports are generated much faster, maybe it’s because I only have a few tasks tracked in Harvest thus not having a heavy database.

The eye-catching sync message that you surely cannot miss.

As for the timer, the Ajax functions are much robust and faster. The sync message is concise – it only shows you a text that it’s actually syncing instead of Toggl’s loading image without any text. I find myself not noticing the loader image in Toggl sometimes, which is bad. If you want the user to wait for the sync to finish, have a more animated sync message like Harvest is better in my opinion.

Can you tell where is the loading indicator?

However, I do like the homepage of Toggle timesheet more. It shows your tracked task in one-page Ajax timeline instead of Harvest’s multiple steps of selection before you can start tracking your time.

Recently, I also discovered that Toggl has ‘offline mode’. It is where you can track time in Toggl even when you don’t have Internet connection. All the data will be stored offline in your computer and synchronized with Toggl servers automatically once you’re back online. This is especially useful if I am working on the go without an Internet connection and I need to track my time.

The Verdict

We are sticking with Toggl, but definitely will bear in mind about the extra bits and bobs that Harvest is able to offer.

So, what about you? What time-tracking software are you using for your company?

The post Software Wars: Toggl vs Harvest appeared first on Stampede: the strategic design & technology company.

I have had Skype 1-on-1 Joomla training session which really helped to speed up the steep learning curve of the Joomla engine in just a matter of hours! The best is that I got to do hands on practise compared to if I were to learn from private courses. I even went to the company’s warm home-office in the Langkawi island for a bootcamp session! At Stampede we really embrace the culture of teaching.

Few weeks ago we added a new designer to the team. His name is Wan. He has no prior experience in HTML and CSS so I was assigned to teach him the basics of the markup language and the process of styling a site from design.

So Wan and I went to setup a meeting session to create a simple typography test site. It’s a simple three-columns layout. We started from scratch. By that I mean from writing the first <head> tag and explaining the markup language from there to introducing CSS elements like ‘background’, ‘padding’, font-family’, etc.

There were certainly a few little bumps along the way like looking for an editor, getting a FTP client and such. The anal part of me even have to overlook a couple of syntax and indentation inconsistencies, but it is all good at the end of the day because these are part of the learning process. I learned that the best way to teach is to let the mistakes happen. For example, letting Wan knows the consequences of a missing bracket in a style block is better than telling and reminding him whenever he misses it.

After two hours, we got it done and I had a really satisfying sensation considering that we got Wan from zero to building a three-columns layout site.

Here is a screenshot of our end result:

Sometimes you have to reach into someone else’s world to find out what’s missing in your own.
– Intouchables

The post The Joy Of Teaching appeared first on Stampede: the strategic design & technology company.