Problems with Package Managers – Bower Edition

Are you a front-end developer, working every day with HTML, CSS and JavaScript? Then you have probably heard already about Bower, the package manager for frontend JavaScript. You can install the client via NPM. Bower is based on Node.JS but doesn’t use NPM as registry, it’s a completely separated project with it’s own registry. You can use Bower as a Ruby, Python or PHP guy as well. Installing a package works like this:

bower install backbone#1.1.0

Which will download backbone version 1.1.0 and his dependencies into the directory ./bower_components/backbone/. All Bower packages are downloaded into ./bower_components.

Bower is handling versions and dependencies but It does NOT wire the JS components into your project. And that’s OK! It doesn’t force you to a specific directory structure. That’s all up to you.

Last week we finished the bower integration for VersionEye.  More than 5K JavaScript packages are now available through our search, powered by ElasticSearch and can now easily be followed. If you want to get notified about a new version of your favorite JavaScript package, simply follow it on VersionEye and you will receive an email notification on the day they release the new tag/version.

During our integration work we had to crawl the bower registry and GitHub to get the meta data in our MongoDB / ElasticSearch backend. Here are some interesting numbers I would like to share with you.

All registered bower packages are available through this JSON file:

https://bower.herokuapp.com/packages

Each element in the array contains the name of a bower package and the URL to his repository. At this time the list has 8504 entries. Only 47 URLs don’t link to GitHub.

bower_github

Some of the 47 URLs link to Bitbucket and funny entries like 192.168.0.131 🙂

We consider a bower package valid if both of these conditions are true:

  • The URL still exists and is publicly available.
  • The repository contains a valid bower.json or component.json file.

From the 8504 packages 2515 we couldn’t validate. That means either the repository doesn’t exist anymore or we couldn’t find any bower.json file or the the bower.json file was not valid JSON. 5989 packages had valid bower.json files.

bower_valid

More than 900 registered repositories simply don’t provide a bower.json file. Other ones provide a bower.json file but it contains errors. The most common error is that there is a comma to much or to less in an array definition.

From the 5989 packages we could validate, 1194 don’t have any version tags in the associated git repository. 4795 packages provide at least one tag.

bower_tags

Having a package registered on a package manager without fixed version/tag is a bit useless. From all 8504 registered packages only 4795 offer a valid bower.json file and some tags on their repositories.

bower_comp_valid

Specification

The bower specification describes exactly how a valid package has to look like. One of the points for the name is: “Lowercase, a-z, can contain dash or dot but not start/end with them“. But actually 495 packages do have uppercase characters in their name. That alone is not dramatic. But some packages are registered with the same name. For example the “scroller” package. It is registered as “scroller” and “Scroller”. Two different GitHub repositories with almost the same name. The only differentiator is the lowercase/uppercase S in the beginning. We were able to find 34 names where collisions occur if you force lowercase names.

Validation

There is a very simple reason for this numbers. There is currently almost no validation on the submissions. But user authentication and package validation is already on the todo list of the Bower team. I expect many improvements in the next months. However, launching a package manager without any kind of validation was maybe not the best idea.

Conclusion

I don’t wrote this article to keep you away from Bower. The people behind the bower project are smart guys and very responsive on Twitter. They are continuously improving. And by the way, it’s all open source. Everybody can send a pull-request to improve the validation. I already send a pull-request for the name validation.

Having some kind of versioning for frontend development is very important. Otherwise you just download some CSS and JS files from the Internet and put them into your project. After a couple weeks most likely you don’t even remember which version of backbone your are using. Imagine doing that with your ruby gems or python libraries! Developers should take versioning of their frontend code as seriously as they do for their backend development.

If you are a Ruby on Rails developer you should check out this page https://rails-assets.org/ for rails – bower integration.

If you wanna know more about how to monitor a bower.json file or how to get a dependency badge for your bower project you should check out this blog post about our Bower integration.

What are your experiences with Bower? Leave a comment here or contact me on Twitter. I would like to hear your opinion to this topic.

Bower Integration

We finished our bower integration! Yeah 🙂 So many of you requested this integration and now it’s done. Now I will get a bit fewer emails per week 🙂

BowerJS Bird

Through the bower integration we have now additional 5K+ JavaScript and 500+ CSS libraries on VersionEye, you can follow. Check out the JavaScript page to see the most followed libraries. Currently jquery-mobile, jquery and backbone are the most followed JavaScript libraries.

Thanks to Bower we can now show dependencies on the JavaScript pages. Just like for Ruby, PHP, NodeJS and other languages. Beside the dependencies we show you some bower code snippets and a download link.

Screen Shot 2014-01-28 at 17.26.01

And since we have the dependencies now, we can display dependency badges for JavaScript libraries too 🙂

dep_up-to-date dep_out-of-date dep_none

I’m looking forward to see them on the README pages on GitHub 🙂

Beside the follow feature VersionEye can actively monitor your bower.json file on GitHub and notify you about out-dated dependencies. In the login area just navigate to the repository and turn on the switch beside the package file.

Screen Shot 2014-01-28 at 17.58.08

Just turn it on and you will receive an email notification as soon their are updates available for your bower.json file. Stay passive & up-to-date 😉

Screen Shot 2014-01-28 at 17.58.39

The bower integration is kind of new. If you see anything that doesn’t seems to be OK, then just contact me on twitter or submit a message via the contact form at VersionEye.