Agile Computing Authors: Pat Romanski, Zakia Bouachraoui, Elizabeth White, William Schmarzo, Liz McMillan

RSS Feed Item

JavaScript Optimization Techniques Today

The wild popularity of Ajax fueled widespread usage of JavaScript. Almost every web 2.0 application relies on JavaScript to deliver front end interactivity. A growing list of JavaScript libraries (over 200+) are being created by various Ajax developers, some of which have gathered significant community adoption.

Though the usage of JavaScript code can lead to significant better overall user experience, it can also bring problems if not used properly. Some of the common performance related problems are:

  1. Sluggish network and runtime performance. It is common to see web pages that load several hundred kilobytes of JavaScript. The size of JavaScript libraries ranges from kilobytes to several hundred kilobytes, or even megabytes. Big footprint introduces not only longer download/parsing time, but also bigger client side memory/CPU footprint. For some browsers, parsing/processing large script can take an excessive amount of time (Firefox bug #313967);
  2. The browser freezes from time to time. There are many cases that JavaScript code can slow down the entire browser instance. For example, too many JavaScript files that need to be loaded may cause excessive number of network round trips; the execution of a long running JavaScript function can block the browser from responding to user events until the function finishes, etc.

There are a variety of techniques people use today to optimize JavaScript performance. Some of popular ones are:

  1. On-demand loading (lazy loading)

    Instead of loading all JavaScript files up front, loading them only when necessary can reduce the upfront network impact. A lot of JavaScript libraries provide such functionality, such as YUI loader and Dojo’s package system.

  2. Concatenation

    Concatenation is an effective way to reduce the number of round trips. Instead of loading different JavaScript files using separate HTTP requests, concatenating these files into one file would enable all of them to be loaded using one HTTP request. Dojo ShrinkSafe and YUI Compressor are two popular tools that supports file concatenation.

  3. Minimization (and Obfuscation)

    JavaScript programs are delivered to the client side as plain text where it is compiled on the fly and executed. However, there are two downsides of this approach. The first is code size. The source can contain materials (such as whitespace and comments) that are not necessary for code execution but rather for the purpose of aiding human readability of the code. Such materials have negative performance impact. The second side effect is lack of code privacy. Given that the code is delivered as plain text, someone could read it, learn our techniques, and may even gather hints from the source code on how to compromise our security.

    JavaScript minimization and obfuscation are techniques to deal with both issues. Minimization removes the comments and unnecessary whitespace from JavaScript source code. Obfuscation changes the names of variables, functions, and members to strings that are harder to understand (and typically shorter).

    JavaScript tools typically implement support for both obfuscation and minimization. Some of the popular tools are (see References):

    • Dojo ShrinkSafe
    • YUI Compressor
    • Dean Edward’s JS Packer
    • JSMin

Applying the above techniques, it is possible to achieve a footprint reduction of 20% to 50%.

Read the original blog entry...

IoT & Smart Cities Stories
Dion Hinchcliffe is an internationally recognized digital expert, bestselling book author, frequent keynote speaker, analyst, futurist, and transformation expert based in Washington, DC. He is currently Chief Strategy Officer at the industry-leading digital strategy and online community solutions firm, 7Summits.
Digital Transformation is much more than a buzzword. The radical shift to digital mechanisms for almost every process is evident across all industries and verticals. This is often especially true in financial services, where the legacy environment is many times unable to keep up with the rapidly shifting demands of the consumer. The constant pressure to provide complete, omnichannel delivery of customer-facing solutions to meet both regulatory and customer demands is putting enormous pressure on...
IoT is rapidly becoming mainstream as more and more investments are made into the platforms and technology. As this movement continues to expand and gain momentum it creates a massive wall of noise that can be difficult to sift through. Unfortunately, this inevitably makes IoT less approachable for people to get started with and can hamper efforts to integrate this key technology into your own portfolio. There are so many connected products already in place today with many hundreds more on the h...
The standardization of container runtimes and images has sparked the creation of an almost overwhelming number of new open source projects that build on and otherwise work with these specifications. Of course, there's Kubernetes, which orchestrates and manages collections of containers. It was one of the first and best-known examples of projects that make containers truly useful for production use. However, more recently, the container ecosystem has truly exploded. A service mesh like Istio addr...
Digital Transformation: Preparing Cloud & IoT Security for the Age of Artificial Intelligence. As automation and artificial intelligence (AI) power solution development and delivery, many businesses need to build backend cloud capabilities. Well-poised organizations, marketing smart devices with AI and BlockChain capabilities prepare to refine compliance and regulatory capabilities in 2018. Volumes of health, financial, technical and privacy data, along with tightening compliance requirements by...
Charles Araujo is an industry analyst, internationally recognized authority on the Digital Enterprise and author of The Quantum Age of IT: Why Everything You Know About IT is About to Change. As Principal Analyst with Intellyx, he writes, speaks and advises organizations on how to navigate through this time of disruption. He is also the founder of The Institute for Digital Transformation and a sought after keynote speaker. He has been a regular contributor to both InformationWeek and CIO Insight...
Andrew Keys is Co-Founder of ConsenSys Enterprise. He comes to ConsenSys Enterprise with capital markets, technology and entrepreneurial experience. Previously, he worked for UBS investment bank in equities analysis. Later, he was responsible for the creation and distribution of life settlement products to hedge funds and investment banks. After, he co-founded a revenue cycle management company where he learned about Bitcoin and eventually Ethereal. Andrew's role at ConsenSys Enterprise is a mul...
To Really Work for Enterprises, MultiCloud Adoption Requires Far Better and Inclusive Cloud Monitoring and Cost Management … But How? Overwhelmingly, even as enterprises have adopted cloud computing and are expanding to multi-cloud computing, IT leaders remain concerned about how to monitor, manage and control costs across hybrid and multi-cloud deployments. It’s clear that traditional IT monitoring and management approaches, designed after all for on-premises data centers, are falling short in ...
In his general session at 19th Cloud Expo, Manish Dixit, VP of Product and Engineering at Dice, discussed how Dice leverages data insights and tools to help both tech professionals and recruiters better understand how skills relate to each other and which skills are in high demand using interactive visualizations and salary indicator tools to maximize earning potential. Manish Dixit is VP of Product and Engineering at Dice. As the leader of the Product, Engineering and Data Sciences team at D...
Dynatrace is an application performance management software company with products for the information technology departments and digital business owners of medium and large businesses. Building the Future of Monitoring with Artificial Intelligence. Today we can collect lots and lots of performance data. We build beautiful dashboards and even have fancy query languages to access and transform the data. Still performance data is a secret language only a couple of people understand. The more busine...