ArcGIS Blog

Using Bower for custom builds of ArcGIS API for JavaScript

Esri recently released a Bower package to enable local custom builds of the API. The advantage of using a custom build is that your application downloads and parses only the required JavaScript resources which will make your application load faster. The Bower package can be used in conjunction with other JavaScript tools like Grunt to do optimized builds of your applications.

How does it work?

Bower is a front-end package manager for your JavaScript projects. It allows you to download JavaScript packages that you can use in developing your applications. You can see examples of how to do optimized local builds in this resources project that demonstrates how to do builds with Dojo or RequireJS.

If you don’t have Bower installed, you can do so by following the instructions here. Once you have Bower installed, it’s very easy to install the ArcGIS API for JavaScript into your application with the following terminal command.

bower install --save arcgis-js-api

This will install the ArcGIS API for JavaScript into a directory called bower_components and you can start working with it in your application.

What are the drawbacks?

The CDN version (Esri hosted using a Content Delivery Network) has its advantages in that you do not have to host the API yourself. This may or may not be an issue for your development workflow.

The ArcGIS API for JavaScript is a large library with lots of modules to meet a variety of needs. While developing your application this can lead to longer than normal startup times as each individual module is loaded. This is however only an issue during the development process. AMD projects are meant to be run through a build process and once you do build your application, it will be highly optimized and load a minimial amount of files.

When you have completed developing your application and you are ready to deploy a release build, you will need to get familiar with the build process. We recommend using the Dojo build tools to optimize your applications. You can however use the RequireJS Optimizer to build your applications.

We have provided build examples for both Dojo and RequireJS.

More detailed documentation will be available as part of the 3.15 release of the ArcGIS API for JavaScript in a few weeks.

Is Bower right for me?

The Bower package of the ArcGIS API for JavaScript is meant to compliment the other channels for the API, via the CDN or the download to locally host it. It is also not a replacement for the online JavaScript Optimizer.
The JavaScript Optimizer provides you various methods to create an opimized build of the ArcGIS API for JavaScript for use with your specific application. The Bower package is for developers that want to integrate the build process into their current development workflows.

If you are currently using tools like Grunt or Gulp to write your applications, you will find the Bower package useful.

Summary

If you are comfortable with the CDN, locally hosting the API, or using the JavaScript Optimizer there is no reason for you to change your workflow.

If you have had a deep desire to get your hands dirty and integrate the ArcGIS API for JavaScript into your current build steps, then the Bower package may be just right for you.

Enjoy and build great things.

Contributed by Rene Rubalcava.

About the authors

20+ years of experience with web mapping. Currently lead project engineer for the ArcGIS Maps SDK for JavaScript development team at Esri.

Connect:

SoftWhere Developer, blogger, author, geodev, and connoisseur of programming languages and JavaScript frameworks. I blog at https://odoe.net and post videos at https://www.youtube.com/c/renerubalcava I write code, sometimes it even works.

Connect:

Julie Powell is a Principal Product Manager, focusing on Esri's web development technologies. She works to ensure developers can be successful in building state of the art, purposeful solutions using ArcGIS software. Julie brings 20 years of experience working with global leaders such as Hewlett-Packard and Esri, delivering a variety of software solutions for both the enterprise and consumer markets. Julie has worked on a wide range of projects and consulting endeavors, including serving as technical lead for web mapping solutions for strategic customers.

Connect:

Next Article

Empowering Communities with Open Data

Read this article