Postmortem of a UI repaint issue on Chrome

A while back, a section of our users started reporting a UI rendering issue while using Postman. The interesting thing about the issue was that it occurred only on very high resolution monitors. High resolution to the tune of 2k, 3k displays and above (such as Macbook Retina displays.) As such, full HD users did not face this issue. Having said that, it was quite annoying for the ones facing it.

Intermittently, parts of the UI would not redraw itself for no reason whatsoever and usually resizing the app window would fix it momentarily. There was no predictable way to reproduce the issue and nor did we discover the root cause of the issue. The screenshots submitted by our users were the only starting point we had.

Continue reading Postmortem of a UI repaint issue on Chrome

Check if UNIX Path has Hidden Directory or File

This snippet of code uses regular expression to test if a path string contains any hidden directory. The use-case was derived from the difficulty in determining whether directory is hidden or not using NodeJS path module. Owing to the possibility of their existence within a long path string, this function returns false if any directory or the terminal file of a path has a name that starts with a dot.

A relevant StackOverflow question is located at http://stackoverflow.com/questions/8905680/nodejs-check-for-hidden-files/ and a gist is at https://gist.github.com/shamasis/7704671

Quick Validating JavaScript Function Before Call

There are many instances where we have to execute a function where we have no idea whether it actually exists or not. Let’s say for example, a function expects another function passed to it as parameter, which would later be executed as callback. A very common usage would be the callback function sent to AJAX requests.

Generally, we would code it with an if-block and check whether the variable (say, callback) is a function or not. If it is, we execute it when we have the work completed (say marked by a variable called workIsDone.)

Continue reading Quick Validating JavaScript Function Before Call

Setting Default Variable Value in JavaScript

Often, there are conditions where we need to provide a default value of a variable if it is undefined. As a case study, we will take up the situation, where we are passing a Boolean value to function and if the input is true, some action has to be taken. In case someone does not pass any value, the input is assumed to be true.

Continue reading Setting Default Variable Value in JavaScript

Infinite Ways to Detect Array in JavaScript

JavaScript (ECMA script in general) is a miraculous language. It allows us to prove that coding is creativity. One reason for that is the numerous ways a single objective can be coded. For instance, checking whether a variable is an Array, can be done in four different ways. And probably more!

Some months back I had come across this Quora article: What's the best way to tell the different between an Array and other kinds of objects in JavaScript? There were already five different methods available there from Tom, John, Rick, Ken and Eric. And even I was surprised that I could add one more! I would take some time and explain all the methods with its pros and cons and finally we can conclude upon the best method.

Continue reading Infinite Ways to Detect Array in JavaScript

Minor Bug Fix to jQuery Touch Drag Plugin

On 21st of June, the jQuery drag event plugin with iPhone (iOS) touch support was released. It has helped to add touch-based drag functionality to many existing web applications using the jQuery drag plugin. A minor update is released for this plugin that fixes the possibility of lack of touch-drag functionality on certain touch devices. Continue reading Minor Bug Fix to jQuery Touch Drag Plugin

JavaScript Drag Events on iPhone and Other Touch Based Devices

For quite a while this week, we were trying to work on dragging JavaScript elements on iPad and other devices with touch input. For our case, we already had jQuery included in our codes, hence we were tempted to use the touchmove event and depend on native jQuery to do the rest.

Things turned out to be a bit trickier. After implementation, it struck us that with jQuery bound events, event.pageX and other related mouse coordinate attributes would not work. Add to that, we were using the jQuery.event.drag plugin by ThreeDubsmedia to seal of the dirty job of drag-related coding.

Armed with the above two problems, we started to do what we thought would be the fastest solution – modify the jQuery.event.drag plugin for a graceful upscale!

Continue reading JavaScript Drag Events on iPhone and Other Touch Based Devices

Optimized Trapping of Undefined-like Values In JavaScript

While working on the FusionCharts JavaScript charts, there was a frequent need to test whether a variable was null, undefined, NaN or an empty string. The “frequent” need was so frequent that the probing function alone took up 15% of the chart’s execution time.

Continue reading Optimized Trapping of Undefined-like Values In JavaScript

Dynamically Update FusionCharts XML Attributes

This snippet of code adds the functionality to dynamically update FusionCharts DataXML root attributes (also known as "chart attributes") on-the-fly using JavaScript.

In case user requires to update chart cosmetics like turn off animation or change chart caption, this script will allow developers to do that in one line of code!

Continue reading Dynamically Update FusionCharts XML Attributes