sheen effect image

Tze-chiu Lei

Web Developer

Share

Feature-Detection v. Browser-Sniffing

Whenever cross-browser support includes mobile, use browser-side feature-detection for styling/functionality, and server-side browser-sniffing for desktop/mobile content management.

Ever since I learned a few years ago that best practices discourage browser-sniffing for cross-browser support, I’ve been using feature-detection instead.  However, for mobile support my challenge goes beyond styling and functionality…

Because mobile data plans are expensive, I need to also manage the amount of content sent to devices.  Using feature-detection to hide desktop-only content from mobile browsers won’t help on this count — the device has already downloaded the desktop content and wasted that bandwidth, before feature-detection occurs browser-side.

What I needed for mobile support content management was server-side browser-sniffing.  I don’t think there’s any other way to manage what kind of content gets sent out in the first place.  This would enable me to send only mobile content to mobile browsers — the server would omit sending any desktop-only content, thus saving bandwidth.

Server-side browser-sniffing would also give me the option of redirecting mobile browsers to a completely different subdomain, say m.tze1.com.  For now though, I think I’ll stick with just one domain to preserve maintenance efficiency.

So, does the feature-detection best practice still apply?  Yes, but only browser-side and for styling and functionality.  For desktop/mobile content management, use server-side browser-sniffing.

Google could only help me to a certain extent on this topic, because most online articles would focus on only styling/functionality or only content management.  Browser-sniffing would always be discouraged in styling/functionality articles, but always cited as the only way to implement desktop/mobile support in content management articles.  It took me quite a while to figure out that the two categories of articles were not actually contradictory but rather complementary!  This is why I’m posting here, because I could see other developers scratching their heads like I did about this topic.

Hope this helps someone!  As always, please chime in and let me know YOUR thoughts!  🙂

iPhone Productivity Apps

I came across Ken Hess’ article “Top iOS Apps lists not boding well for BYOD” on ZDNet, and noticed a nice list* of productivity apps for iPhone:

  1. Citrix Receiver
  2. VNC
  3. RDP
  4. vSphere Client
  5. iSSH
  6. Quickoffic
  7. FileApp Pro
  8. Fing
  9. Printer Pro
  10. Dragon Dictation
  11. VMware View
  12. Fing
  13. Ubuntu One Files
  14. iSQLQuery
  15. PlainText
  16. Dropbox
  17. Time Zones
  18. hypOps
  19. SharePlus Lite
  20. Zoho Docs

Ken’s got a point.  If iPhone users want to bring their iPhones to work, they’d be well-advised to remove the games or at least move them off the default/home screen.

What I don’t understand though is why he singled out iOS, as if there are no games available for the Android or Android users don’t download games.  (???)

I added a comment to his article, so maybe he’ll respond.  :::fingers crossed:::

*DISCLAIMER: I don’t have an iPhone, so I can’t vouch for the validity of the list.  If you have any questions/comments on the apps selection, please contact Ken directly — there’s a Contact link at the bottom of his article.

JavaScript Double-Bang (!!): Good for Teamwork?

double-bang

At first I thought it was a typo in the JavaScript — two consecutive exclamation marks (!!).  So did a couple fellow developers, until we Googled it.  Turns out this is actually a Boolean conversion shortcut, called a “double-bang.”

Instead of typing the following to check for an Object…

if (typeof someObject !== undefined) ...

you can just type…

if (!!someObject) ...

The inner “bang” converts your Object to a Boolean, and the outer one rectifies the converter’s negation side-effect.

Pretty cool!  I think i’ll start using double-bangs on my solo projects, but…

I’m not going to use it on team projects though.  Why?  The chances of some other developer deleting it by mistake are just too great — it just looks a lot like a typo!  You could include a code comment to clarify to the team what a double-bang is, but that’d defeat the purpose of the shortcut, costing more keystrokes than you saved.  😀

Sometimes, for the sake of the Team, it appears necessary to avoid those advanced coding techniques that carry risks similar to this double-bang example.  The process challenge I see here is, striking a balance between maximizing code performance/efficiency and minimizing team rework or code breakages.  To put it another way…

How do we empower our “Rock-Star” coders without leaving the rest of the Team behind?

Issue Tracking and Version Control: My new best friends!

I never thought I’d say it, but I’ve put all my solo projects on issue tracking and version control.  I used to think it was overkill, but after working enough projects these last few years I’ve definitely changed my mind!

Trac logoI revisited a few projects last year that had been inactive for months.  It was almost impossible to remember where I had left off or what I had been trying out previously.  Sometimes I’d remember what I was doing but not why, other times vice versa.  Having my projects now on issue tracking has saved me from this “project amnesia!”

I’m also finding that issue tracking enhances discipline in my coding.  Before, I often used to just make improvements wherever and whenever I saw opportunities.  That sort of development exposed projects to my perfectionist streaks, and I often had to trim my billable time afterwards because of all the “gold-plating.”  Issue tracking has put me back on “the straight and narrow” — do what is required and no more.  With large, complex enhancements, issue tracking’s also enabled me to organize development into logical phases/components, so that I could focus better when coding.

Subversion logoWith a couple projects last year, I had major enhancements to implement across all the application tiers.  It was a real headache working on a new feature over several sessions, only to have it break and not remember exactly what changes to drop. Worse yet, I’d make guesses at what to drop and end up dropping too much, sometimes breaking other features!

Version control was my aspirin.  Now with my project version-controlled, there’s no more racking my brain about what changes broke what, because I can selectively roll-back changes to troubleshoot issues, or if need be, roll back a whole range of changes for a phase in case of a big failure.

What’s more, version control gives me tagging and branching, which I’ve come to LOVE!  It’s very nice that I can create a development branch and develop a new feature without affecting the trunk.  Before, I used to make a separate copy of the site, develop the new feature, then manually copy-n-paste my new feature back to the original site — NOT very reliable!  Now, I develop a new feature in a branch while keeping it synchronized with trunk, then when the new feature is finished I just re-integrate the development branch back into trunk.  Badda bing, badda boom!

Yep, I used to think issue tracking and version control were for the big development houses, but no more!  They help me immensely with my projects, even the smallest ones.

Interested in giving them a try?  I’m using Trac for issue-tracking, and Subversion for version control, and both are free and open-source.

WordPress Blog customized!

WordPress logo

I just finished WordPress customization for this Tze1 Blog, and you’re looking at the results here right now!  I wanted the Blog to look and feel like the rest of Tze1.com, and I’ve achieved it.  It went smoother than I expected.  I had anticipated lots of head-scratching while trying to understand WordPress’ complex architecture, but its clean separation of styling from functionality made my customization straightforward and relatively painless.

The biggest challenge here wasn’t the styling customizations, but rather the functional modifications to match usability/behavior to my own requirements.  Beyond digging deeper into the template code, I also had to determine which code snippets were functional and which deprecated.  Like with so many other software projects, there’s “garbage” code that’s no longer used but never deleted.  This seems to be a widespread challenge in the development process, where developers are wary of deleting code for fear that it’s still in use by something else outside of whichever portion they’re updating.

I’m a bit of a stickler when it comes to usability, and I strongly disliked the default Twenty Eleven Theme’s Comment/Reply form.  Somehow, WordPress broke it’s own dynamic form title functionality — the title didn’t adjust itself to indicate whether you’re Posting a new Comment or Replying to an existing one.  I had to add my own code to restore the dynamic title, and while I was at it I also made the message input label dynamic for even better usability.

I know my customization isn’t 100% perfect just yet, but I wanted to roll the Blog out now to start our Conversation!  So, CHIME IN and let me know what you think so far!!

 

Hello World!

Tze
Tze

This is where I’ll be posting my thoughts and ideas on web design, web development, and sometimes things beyond the Web.

You’re encouraged to Comment on my Posts here. No Login is required, and all you’d need to provide is your name and email address. Your email address will not be displayed publicly, and will never be sold to spammers.

So, READ, ENJOY and JOIN IN THE CONVERSATION! 🙂