An article on 2nd Generation JavaScript Frameworks & Libraries: beyond Angular, React, and Vue! recaps Geertjan Wielenga’s talk on the evolution of JavaScript and the influence of the enterprise in recent years. Background Wielenga spoke of the pioneers of JavaScript frameworks and libraries including Dojo (1.
TypeScript has become a mainstay of modern web development libraries. Consuming functions and widgets written by a third party can be error-prone without some type of guidance. Introducing static typing to the interfaces doesn’t just reduce misuse, it has added benefits including intelligent code completion.
All Things Open is a large, community-created open source conference in Raleigh, North Carolina, with nearly 4,000 attendees and 20 concurrent sessions. At this year’s event, I was invited to deliver a talk similar to one I had presented at JSConf titled “React Already Did That.
The TypeScript 2.4 release might be a minor update in terms of not requiring substantial changes within our open source work and customer projects, but it provides some major benefits that we are already leveraging throughout the Dojo 2 codebase.
TypeScript 2.3 is the latest version in the quarterly release cycle from the TypeScript team. This release contains several useful additions to TypeScript which we have already started to leverage within some of our current projects.
dojox/gfx is Dojo 1.x’s vector graphics library, with support for SVG, Canvas, and other legacy rendering environments through a drawing API based on the semantics of SVG. This API also provides the foundation for dojox/charting. Often the biggest challenge in working with vector graphics is the large number of possible configuration settings and permutations.
As many of you know, Dojo 2 is being built on TypeScript. Many of us involved in Dojo 2 believe that TypeScript brings several advantages to developing with web technologies these days.
Functional programming and reactive programming principles are not new to JavaScript, but their adoption has recently become widespread across most modern frameworks and toolkits.
The TypeScript team recently announced the TypeScript 2.2 release candidate which will contain key improvements to the TypeScript language. Most notably, are the introduction of the object type and improved support for mixins and composable classes.
Web applications can be deployed to many environments, including desktops, tablets, and mobile devices. We can even deploy web applications natively using a wrapper such as Apache Cordova to gain access to device features such as GPS, battery, and accelerometer data.
It’s been two very active years since the release of ES6, and we’ve seen pretty substantial changes in how we build JavaScript applications. While some complain of fatigue, there’s never been a more exciting time to be a JavaScript engineer.
As the new year starts to unfold, it’s time to take a quick look at the things our team at SitePen resolves to do this year.
The TypeScript team has just announced the release of TypeScript 2.1 which contains several long-awaited features (pun intended) for Dojo 2.
This October, we delivered meetup talks on WebVR in London and Phoenix on the same day to share our early efforts in exploring WebVR with TypeScript, Dojo 2, Intern, and A-Frame.
The official name of the rebranded and relaunched merging of the jQuery Foundation and the Dojo Foundation is the JS Foundation.
SafetyNet is an annual conference hosted by Pulsiam and is focused on trends in software for the safety industry.
One of the main challenges with creating modern JavaScript web applications is the relatively incomplete approach to ES modules. As an interim solution until all necessary use cases are solved, many developers create source code with ESM, and then transpile to either AMD, CJS, or UMD for easy usage within today’s browsers.
Over the past few years, TypeScript has iterated and greatly improved developer ergonomics.
Recently on GitHub, someone accused Dojo 2 of being vapourware. This opinion came from a position of misinformation. I was glad the individual then engaged with the Dojo 2 project to understand where we are today. We are making swift progress and a beta is on the horizon.
We were recently asked about options for mixing Dojo widgets and Angular 2 components into the same application: Is it possible to render an Angular 2 component and Dojo widgets on the same page? Are there any special configuration settings needed? What’s the best way for Angular 2 and Dojo to communicate and/or send messages?
In this installment of our series on building web applications, we look at the SitePen approach to solving challenges in web application development. We employ all of the solutions described in part 2 of the blog series. Additionally, we have some overarching principles we apply to our work.
While there are many challenges today with building web applications, there are also many options to address the issues we face with technology, process, and people, allowing us to reap the benefits of the web as an application platform.
Web applications provide many benefits. Most organizations seek to improve the efficiency and effectiveness of business processes through the use of software. The benefits of web applications include: Simple distribution model for end users (e.g. no installation required) Instant propagation of changes Unified code base to support many platforms (desktop, tablet, mobile, etc.
One of the additions of the recent Dojo 1.11 release is a modern flat theme created with the Stylus preprocessor. The flat theme allows you to apply a modern, flat look and feel to existing Dojo applications.
Peter Higgins, former project lead for Dojo, gave an excellent talk at JSConf in 2013 titled “Dojo Already Did That” (which reflected a humorous meme started at the first JSConf). It was highly informative about how Dojo had already solved problems that the JavaScript community were solving again in 2013.
Until a few years ago, our testing efforts with Dojo were focused on the Dojo Object Harness (DOH), a very early unit and functional testing suite.
Intern, via the Leadfoot WebDriver library, provides a lot of low-level control over the browsers it uses to run tests. Tests can navigate to new pages, resize the browser window, examine elements on a page, and interact with controls like inputs and buttons. Unfortunately, with all this power can come great complexity.
Esri, the creators of great mapping technology, hosts their DevSummit every March in Palm Springs, CA. Esri creates their popular ArcGIS for JavaScript API by leveraging the Dojo Toolkit. Esri trends Each year Esri announces a number of new features and technologies at the DevSummit, and this year was no exception.
One of the nice features of testing with Intern and Leadfoot is the ease of authoring functional tests to mimic end-user behavior. The API for retrieving relevant DOM nodes is relatively straightforward, usually with a single line of code needed to get a reference to the relevant node.
It’s been over a year since the release of dgrid 0.4, which brought about some major changes, including integration with the new dstore API. Since then, we (and others) have used it in numerous applications, and we’ve continued to refine it. Now, at long last, we’re proud to announce dgrid 1.
Adam Klien, software engineer at Google, announced on ESDiscuss that they were withdrawing the proposal to implement Object.observe and plan to remove it from V8 by the end of the year.
In mid-October, I attended my first jQuery Foundation boarding meeting. In case you missed the news, we announced in early September that the Dojo Foundation and jQuery Foundation are merging.
SitePen’s team of JavaScript experts provide high quality development and production support to a wide range of companies, from the Fortune 500 to small startups. Recently, we had the opportunity to assist BuyWinR, a company based in Brisbane, Australia. In this case, we went from initial inquiry to solution in less than 48 hours.
SitePen is a huge supporter of TypeScript. It allows our developers to write using modern standards support for ES6 and some ES7 features while still targeting ES5 browsers. It also includes a type system that adds to our code’s integrity and makes it easier to write good software.
Nearly every sufficiently large web application looks for a mechanism to efficiently synchronize or bind data between the Model and the View.
Dojo and its AMD loader provide outstanding tools for structuring a Web application on the client-side. However, the notion of “writing a JavaScript application” has widened in definition over the past few years with the increased popularity of Node.js. Though Dojo can be used in a Node.
Dojo’s Deferred module provides a convenient way of managing asynchronous operations. If you’re new to deferreds, you can get a good introduction by reading our blog post and some tutorials on dojotoolkit.org: Getting started with Deferreds and Dojo Deferreds and Promises.
Over the past several years, JavaScript has grown to be relevant not only for rich browser applications, but also for server and console applications. Many types of JavaScript libraries can be useful on both ends of this spectrum.
We have released dstore version 1.1, which features a new set of stores for local DB storage. This feature provides the ability to store data locally in browsers, and use high-performance querying capabilities through the disparate technologies of IndexedDB and WebSQL (and localStorage), through the consistent dstore interface.
At the end of 2014, we looked ahead to determine where to focus SitePen’s open source efforts in the coming year.
Dijit and dgrid provide a powerful set of user interface components, allowing for fast construction of sophisticated web applications with excellent performance and interactivity. However, one particular configuration of dgrid that can impact memory and performance: heavy use of persistent Dijit editors within grid cells.
While a more recent advancement allows us use the HTML5 file API to retrieve contents from files, this approach is not universally supported in web browsers as yet.
Performance is a critical part of most applications. Research continually shows that good performance is essential for a good user experience. Reasonable load times, smooth animations, and responsive interaction gives user a sense of interaction and immersion, whereas slow load times frustrate users, and choppy animation and interaction quickly makes an experience awkward and disconcerting.
It’s been a while since we’ve dove into Dojo’s Deferred module on the SitePen blog—the last time was back in 2010 when we introduced the promise-inspired improvements that landed with Dojo 1.5. Quite a lot has happened since on the topic, including a ground-up rewrite of Dojo’s asynchronous foundations in 1.
When building web applications, developers often face the dilemma of whether to use traditional server-side rendered pages, or client-centric applications that rely on Ajax/JSON data requests, with client-side rendering of data. These two approaches also tend to dictate navigation (among other things), leading to traditional page navigation or a single-page application (perhaps with hash-based navigation).
One of the primary motivations for creating Intern was to make support for continuous integration testing much easier to achieve with JavaScript-based application development. We recently converted the vast majority of the unit tests in Dojo core from DOH to Intern, in order to streamline the process of regression testing patches for Dojo 1.x.
We’ve offered our full line-up of public Dojo training workshops for over eight years at locations around the world.
While it will not happen often, there may be times when you need to patch your Dojo source. Perhaps you discovered a bug and are waiting for the fix to be committed or released, or your application uses an older version of Dojo but you want to use features found in newer releases.
We normally try to schedule new minor releases of Intern about once every four to six weeks, but when we are working on a major release, there will often be a larger than usual gap in the release cycle.
A common scenario with web applications is accessing protected resources, which require authentication with the server in order to proceed.
As object stores are frequently used in Dojo-based applications, developers often ask about a good way to utilize stores in their custom widgets. Here we present a common pattern for doing just that in a two-stage approach, starting simple.
In October, 2014, I was coerced invited to deliver a talk at the first FullStack conference in London, a conference focused on Node.js, JavaScript and hackable electronics. The conference was an interesting cross-section of all things related to JavaScript.
Bootstrap is a framework created by Twitter’s developers to consolidate their HTML/CSS design and widgets. Bootstrap provides a clean responsive design, but the set of widgets it includes is limited, especially when compared to what’s available in the Dijit library.
When writing tests for an application, it’s prudent to add mock or stub data in order to allow code to be properly tested in isolation from other parts of the system. Within a normal Dojo application, there are typically three places where mocking will occur: I/O requests, stores, and module dependencies.
Dojo’s store API is a common interface for providing data to user interface widgets, such as dgrid, Dijit Select, and Dojo Charting. The beauty of having a consistent API is that once you’ve defined an interface for a data source, that data becomes easily available to all widgets that support the store API.
In large JavaScript applications, it can be beneficial to dynamically load CSS stylesheets.
At SitePen, we have long been advocates for building web applications on a RESTful architecture. Over the last several years, it has been exciting to see organizations increasingly provide RESTful endpoints for the Dojo-based front-ends that we support and develop.
Modern browsers have powerful new database capabilities that enable applications to store data locally, and perform advanced indexed queries without a network connection. Applications can be built with offline support without any disruption to data interaction, including searching.
Intern is a great test stack for writing full-featured unit and functional tests, with remote WebDriver-based testing (e.g. BrowserStack) and continuous integration (e.g. Travis CI). Debugging failing tests can be a challenge if you don’t know the most efficient techniques for troubleshooting platform-specific issues or problems with your test cases.
dgrid’s Selection mixin dgrid is SitePen’s lightweight, modular, and easily extensible modern grid component, designed for use with AMD and Dojo. The Selection and CellSelection mixins enable selection of rows or cells, both from mouse or keyboard actions and programmatically.
Last month, we conducted a live webcast to provide an Introduction to Intern, SitePen’s open source testing framework.
When working in an event-driven environment such as the web, it is important to utilize tools that allow you to create succinct, easy-to-read code that’s extensible and flexible. One great mechanism that Dojo provides is the ability to use extension events.
dojo/on and dojo/aspect are two APIs that appear to do similar jobs but actually serve two different purposes. dojo/on is used to setup event listeners for DOM nodes and event-emitting objects.
The widgets provided in Dojo’s Dijit library include not only advanced widgets not provided by HTML, but also enhanced versions of the basic HTML form elements, like <input>. Dijit’s dijit/form/RadioButton provides the same basic functionality as an HTML radio button, so let’s look at how you set one to be checked by default.
Many Dojo widgets make use of client-side templating for generating the UI. Template HTML files are brought in to the page with dojo/text, parsed and converted to DOM nodes, and placed on the page, allowing our code to make substitutions, instantiate widgets within the template, and hook up events and attach points.
In web browsers that support Cross-Origin Resource Sharing (CORS) via XMLHttpRequest objects, Dojo’s XHR mechanism can make cross-domain requests out of the box.
What a great year 2013 has been! We’re feeling (collectively) like Ebenezer Scrooge in the final chapters of Charles Dickens’ A Christmas Carol – except we haven’t been jerks up ’til now and we think working at SitePen is a year-round Christmas vacation, unlike the earlier chapters wherein Scrooge forces poor Mr.
In this post, we want to walk through how you would get started building an application using xstyle, an extensible CSS framework. xstyle provides extensions that allows us to declaratively describe an user interface, making use of data bindings, element generation, and components, giving us an elegant means to create an application.
In addition to a simple, consistent, cross-browser interface to DOM events, dojo/on provides for very convenient clean-up – the function returns a handle with a remove method that will un-register the event listener. Clean-up concerns are not limited to DOM events, so Dojo provides the same interface for dojo/aspect and dojo/topic.
Dojo provides many settings to configure the optimal loading and building of your application source code. We are often asked about the differences between packages, paths, and aliases. Here we provide a quick explanation showing common use cases for each.
We answer many, many, many questions on a daily basis through our Dojo training workshops, JavaScript support plans and during our customers’ development projects. We have bucket-loads of answered questions. What to do with them all… Oh? Provide you with the answers? Ok.
As part of our great updates to the Dojo Tutorials for Dojo 1.8, we’ve been busy creating several new tutorials. Feature Detection and Device Optimized Builds Dojo 1.7+ now uses the popular has() pattern for feature detection in combination with a has()-aware build system.
When developing a JavaScript framework that others will consume, it’s hugely beneficial to provide clean, organized API documentation to accompany your codebase. With the August release of Dojo 1.8, we saw a brand new, extensible documentation parser, which is used to generate output for Dojo’s API viewer.
As was illustrated with our Dive Into Dijit with AMD post, the Dijit library provides an extremely powerful, flexible set of Dojo-based widgets with which you may easily enhance the look and functionality of your web application. These widgets include drop down / popup menus, dialogs, page layouts, trees, progress bars, and form elements.
As part of our great updates to the Dojo Tutorials for Dojo 1.8, we’ve been busy creating several new tutorials. Key Events This tutorial teaches you how to easily handle keyboard events with Dojo’s event normalization and dojo/keys implementation. Check out the Key Events tutorial for Dojo 1.8, 1.7, or 1.
The previous installment of the Dive Into Dojo series shows how easy it is to Dive Into Dojo Charting. It comes with dozens of stylish themes you can effortlessly plug into any chart.
As part of our great updates to the Dojo Tutorials for Dojo 1.8, we’ve been busy creating several new tutorials. Augmenting Objects In JavaScript applications, you’re working with objects all day long. This tutorial covers the features found in dojo/_base/lang for augmenting your objects efficiently.
Dojo has an API for Comet-style real-time communication based on the WebSocket API. WebSocket provides a bi-directional connection to servers that is ideal for pushing messages from a server to a client in real-time.
Debugging JavaScript can be a tedious and frustrating chore. To compound the already difficult task of debugging, browser vendors each have their own style of error messaging, some of which are confusing, cryptic, or downright misleading to the untrained eye.
In our recent post on dgrid and Dojo Nano, we showed a technique of using nested require statements in order to make use of optimized layers using the Dojo build system. As a refresher, a layer is Dojo’s terminology for a file that combines many JavaScript resources into a single file.
Juan Carlos Galindo Navarro of Venezuela-based RIATeam shares his early dgrid experience with SitePen. Here’s what he had to say. SitePen: How did you learn about dgrid? RIATeam: As a lover of the progress that Dojo Toolkit provides the community, I am always on the lookout for news and features shown in the SitePen Blog.
As Dojo moves toward its 2.0 release, our focus has been on giving developers tools that will help them be productive in any JavaScript environment. This means creating consistent APIs across all environments. One area that has been sorely lacking, in this regard, is Dojo’s IO functions.
With Wednesday’s release of Dojo 1.8, there are many exciting improvements to check out! Our top goal for this release was to significantly improve the quality of Dojo’s documentation.
Want an easy way to keep up with SitePen efforts on Dojo, dgrid, AMD, JavaScript, and the open web? Then click the Keep In Touch button at the end of this blog and sign up now! To see what types of things you can expect, check out the July edition of the SitePen Insider! With
Linus Ekström of Stockholm-based EPiServer shares his early dgrid experience with SitePen. Here’s what he had to say. SitePen: How did you learn about dgrid? EPiServer: The Dojo website and SitePen blogs. SitePen: Why did you choose dgrid? EPiServer: The existing DojoX DataGrid was too complex to set up and extend.
Dojo 1.7 added full support for asynchronous module loading, defined with the widely adopted asynchronous module definition (AMD) format. The new module loader and module format offer faster module loading, better performance, and wide interoperability.
We have been providing JavaScript and Dojo support to freelancers, start-ups and Fortune 500 companies for nearly a decade.
As a SitePen customer, Øyvind Aaraas of KLP decided to try out dgrid on one of his company’s web applications. When asked about his early experience with dgrid, here’s what he had to say! SitePen: How did you learn about dgrid? KLP: We follow the SitePen blog and learned of it there.
You may have seen our recent blog entitled “AMD: The Definitive Source” which exhaustively explained Asynchronous Module Definition. AMD is a topic with significant technical nuances but the purpose of THIS article is to explain the value of AMD for your business.
So what is AMD? As web applications continue to grow more advanced and more heavily rely on JavaScript, there has been a growing movement towards using modules to organize code and dependencies. Modules give us a way to make clearly distinguished components and interfaces that can easily be loaded and connected to dependencies.
After many months of work, Dojo 1.8 Beta is almost here. We expect beta to be ready for use on June 22, 2012, with the final 1.8 release due 4-6 weeks later! dojo/request We’re very excited about this release for many reasons.
The mobile device revolution has placed new demands on web applications. Mobile devices generally have lower bandwidth and lower CPU capacity, forcing us to avoid large complex code.
You’ve likely read that the new dgrid can be as small as 32KB gzipped when including just its minimal dependencies. However, if you use the standard settings for the Dojo Web Builder or a standard Dojo build profile, you end up with a build that’s closer to 100KB gzipped.
Over the last few weeks, Dylan has given talks across the western United States and Europe and we’ve tracked his every move on our blog. Dylan will finish his trip with stops in Tempe, AZ and Las Vegas, Nevada. Phoenix Mobile Festival. Tempe, AZ. April 21.
The 2012 ESRI Developer Summit is attended by 1,700 developers, half are attending for the first time and thirty percent are from international locations! Dylan continues to mingle with like-minded Dojo enthusiasts from around the world, including people from the US, Canada, UAE, Japan, England, Germany, France, Switzerland, Sweden, Australia, New Zealand, and the Netherlands!
Most 2012 trend lists include 12 trends. (Get it? 12 in ’12. Of course you do.). Because we are not fond of adding unnecessary or filler content (read code), Dylan has come up with 11 trends for 2012. 1. Mobile Mobile will gain even more momentum in 2012.
Welcome to 2012 – The Year of Dojo! We are expecting an amazing year! Make SitePen your one stop shop for all of your web application needs; Dojo workshops, JavaScript support and web app development. Together, with SitePen, you will meet your 2012 goals! When you’re happy, so are we.
One of the most important parts of creating an effective and intuitive user interface on touch-enabled smartphones has nothing to do with visual appearance—instead, it has to do with creating an interface that properly responds to user input based on touch. For Web applications, this means replacing mouse events with touch events. In Dojo 1.
dojo/dnd is one of Dojo’s core APIs and is designed to manage the process of dragging and dropping items between two or more containers. It offers advanced features like multiple selections, item acceptance filtering on drop targets, and other behavioral tweaks.
SitePen’s Dylan Schiemann delivered the last of his three Rich Web Experience 2011 presentations yesterday, Never Bet Against the Open Web. Dylan had this to say about his time at #RWX2011: The level of interest in AMD, object stores, and mobile is impressive.