[updated] Of gridstack.js 1.0

Update: The new release date is August. I know, I know, I promised June. The upside: some of the features mentioned in this post as higher priorities for future releases are included in version 1. The new version is awesome. I have had some recent bumps in my non-open source life, but I’ll commit more dedicated time to developing gridstack.js ASAP. – dylan

(Read the footer if you’re unfamiliar with gridstack.js)

First started on November 9, 2014, gridstack.js is quickly closing in on three years old and has not hit version 1.0. In fact, version 0.3.0 was only just released a few days ago. I’m please to inform you that version 1.0 is coming very soon (by June 2017 soon)!

If you’re already on 0.3.0, you won’t have any problem switching to version 1.0. The APIs remain largely the same, but the API names deprecated in 0.2.5 have been removed. If you’re getting loads of console warnings, please get that fixed ASAP! What can you expect in this long-coming release? Well, dependencies are removed to make way for…a fully working plugin system for dragging, dropping, and resizing! (jQuery and jQueryUI are removed, while lodash may continue to make an appearance). Not only does this mean a smaller footprint and easier usage, but it means that you can use your favorite dragging library (is it dragula? interact?), or even roll your own!

Version 1.0 is all well and good, but what of later, future releases of gridstack.js? Here’s a condensed list of a few of our higher priorities:
  • Responsive widgets (which will change size depending on viewport)
  • Faster collision detection for larger sets of widgets
  • User-chosen gravity – Widgets can be packed upwards, leftwards, rightwards, downwards, or some combination. For reference, gridstack.js currently packs up-and-left
  • Widget swapping – A much-requested feature, we’re working on a way to make widgets swap places so that widgets may still be moveable even in a full grid.



For any questions, please reach out to our community on Slack or log a bug on the GitHub bug tracker.

– dylan (@radiolips)

* If you aren’t already familiar with gridstack.js, it’s one of the few maintained Javascript dashboard libraries. gridstack.js is easy to use, quick to setup, and works with most current technologies (and for @troolee‘s sake, I’ll mention that it was built with love). It’s based on a 12-column layout (Bootstrap, anyone?), so anyone with similar experience will find it easy to lean in to designing their own dashboard software with the help of gridstack. There are plenty of quick-and-easy tutorials to build some beautiful dashboards. Why not try creating a dashboard with charts to start?

17 thoughts on “[updated] Of gridstack.js 1.0

    • Great question, Garvin! I’d recommend subscribing to this blog and/or the blog’s RSS feed. We’re also working on setting up a mailing list – I’ll let you know when that’s done. We’ll push out updates to the mailing list.

  • Question,

    Why did you have to keep lodash? Besides that your library is amazing! Thank you for supporting it!

    • Hey Andrew,

      When we were considering which dependencies to remove, we factored in the quality of the library, the likelihood that it’d already be in a project, and the time it would take us to remove from gridstack. The problem with lodash is primarily that we have many references that would take time to rewrite. Eventually we will remove lodash, but we decided we wouldn’t have time before 1.0 is completed. If you’d like, we’d love to have a PR in to remove it.

      Thanks for using gridstack! Let me know if you have any other questions.

  • eagerly waiting for Version 1.0. When you guys are planning to release it? Any specific date in Jun 2017?

    • I’ve updated the post with a new date (August). I’m disappointed to have had to postpone the release, but I’m twice as excited for the new features!

  • So pleased to see this! We’re about to do a full rewrite of our dashboard and have been looking for a library to use. I like gridstack but had hoped to find something with fewer dependencies, so this timing could not be better. Here we are in the middle of June, though, and no news on 1.0. What’s the word?

    • Hey Alex – I’ve updated the post and commented on Prashant above you, but the short is: there’s been a delay. I hope that this won’t impact your dashboard update. If you do decide to use gridstack, you won’t have much to change when 1.0 is released. You’ll get speed and usability improvements, but we aren’t removing any of the current functionality. Let me know if you’ve got any questions about the update!

      • Completely understandable, I’m still pumped about 1.0. We’ll be prototyping the dashboard this month but we’re not meant to launch anything until November, so we’ve got time. Not that I want to put any meta-work on your plate, but do you have a more detailed list somewhere of the features that will be coming with 1.0? We’re in the design phase right now so if we can *plan* for 1.0 and code for the current version on our first pass, that would be amazing. Thank you for all your hard work on this.

        • The list hasn’t been finalized yet, but the changes are primarily going to be under-the-hood and won’t impact usage. I’m hoping to get gravity implemented into the code such that the widgets can push left, down, or right in addition to the current gravity that pushes widget to the top. I doubt that that will change your plans, but either way – now you know. If you’re coding based on the latest release, it will be a quick swap to the new version for you.

  • Dashboards with charts, tables, graphs and a lot of information. Been there, done that. Absolutely amazing. :p.
    One small question: How is the responsive layout going to behave like? The current responsive example is kind of wanky, as in if you size down the page then change it back, the tiles will be really small as they only take 1 column space (or whatever’s the minimum you set). Is that going to be fixed?

    • Hey, xshteff! Apologies for the delay in response – things have been hectic at work, followed by our Independence Day.

      We haven’t yet made final decisions on the responsive layout, but it will likely be similar to Bootstrap’s system. You’ll be able to set a width/height for 3 or 4 screen sizes (ie xs, small, medium, large).

      The current example is DEFINITELY “wanky,” as you say. It was mostly an example POC.

      Keep checking back – as v1.0 gets wrapped up, we’ll begin looking at these exciting features and I’ll post progress on this blog.

      – dylan

Leave a Reply

Your email address will not be published. Required fields are marked *