Freeing up thread models with web workers

 

Traditionally, Javascript operates in a single-thread model. Any process that needs Javascript - from creating the DOM to rendering a visualization - must wait in line with every other Javascript operation before it can do its thing.

Recently, while working with a large and complex data grid, we discovered that we had an algorithm that took five whole seconds to complete. (That doesn't sound long, but user attention spans are notoriously short.) First, we tried to delay that calculation so it did not start until the rest of the page had loaded. But even then, we found that while the task executed, it completely froze up the UI, leaving the user unable to scroll, click, or do anything but beachball and wait. 

JSCatalyst Tutorial: screen sharing

Here's a situation. You're running JSCatalyst , and you've pulled up a page full of data visualizations and tables. You've customized the filters and styling so it represents exactly the information you need to convey. There are enough different components that the scroll height is too tall for a single screenshot - and then your conversation partner wouldn't get the full interactive experience.

Integrating Complex D3 Visualizations into Vue



On a recent project, we were tasked with integrating a client's legacy D3 visualizations into our new, modernized user interface built on Vue.js. D3 is a powerful JavaScript library used for manipulating documents based on data. D3 operates on common tools - HTML, SVG, and CSS - and is therefore compatible with a variety of frameworks and architectures. Here, we discuss the pattern we used for integrating complex D3 visualizations into Vue.

Topics: Design Thinking, UI

Top