Lots of improvements coming to dabblet

I posted about this in both the WebPlatform.org blog and Dabblet’s blog, but I thought it might be interesting to many readers of this blog as well:

As many of you probably know, I’ve started working for W3C Developer Relations since this August. Half of my time is devoted to WebPlatform.org, a very promising project to document the web with the help of all major players, in a vendor-neutral way. Even before I joined W3C, we discussed using a hosted, customized version of dabblet in WebPlatform.org, as a platform for live code examples. I recently started working towards making this happen.

A lot of changes and improvements need to be made to achieve this, but the good news is, most of these will be pushed to dabblet.com as well! In a nutshell, this is what I’m currently working on:

  • Adding JavaScript support — This will be a challenge UX-wise, as it shouldn’t run on every keystroke, like the HTML and CSS, but it should run on startup and it should be straight-forward how to get it to run. Perhaps it will also run after a significant pause in typing.
  • Dabblets that are not stored in Github, but get their data through POST requests.
  • Improving cross-browser support
  • Strengthening security
  • Integrating Prism. Dabblet’s syntax highlighter might have been Prism’s precursor, but currently Prism has solved many of its bugs, and these fixes need to be pushed to dabblet at some point.
  • General bug fixing

These will probably be gradually rolled out in dabblet.com and tested by the community, before we integrate dabblet into WebPlatform.org. If a new feature is significant enough, there will be a new blog post about it here, but don’t expect blog posts about bugfixes. I’m really excited to see dabblet flourish, and I believe you will be too, once these updates are out!

  • I don’t have one.

    So how will Dabblet be different from the other 1000 similar services? What is the point of Dabblet? Why not use CodePen, JSBin, JSFiddle etc?

    • mon_ke

      From my point of view many of the web services you are talking about are focused on sharing code bits and putting populars on top.

      When I want to challenge myself at some useless CSS experiment (useless in an every-day-work sense of course :) ) I use Dabblet because it is not a social platform, and it relies instead on gists & the like. One tool for one job.

      Maybe the changes to come will make a clear distinction between Dabblet and friends : re-use on remote websites, the “data through POST” thingie (though I have no idea what it is about).

      • Anklepants

        Dabblet is no different, and falls very short on features when compared to let’s say cssdeck. But competition is always good. Who knows Dabblet may become the jsfiddle of css or it may fade to obscurity. Having options is always nice : )

        • http://lea.verou.me/ Lea Verou

          Having tons of features is not dabblet’s goal, good UX is. UI minimalism is actually one of the primary considerations when making dabblet.

          However, speaking of features, a commonly praised one is Dabblet’s previewers, something which I plan to extend even further in the future. Also, its seamless Github integration, which it was the first to offer.

  • http://typecastapp.com/ Chuck Neely

    I love Dabblet (really!), but I’ve found at times it can be a bit performance heavy on the browser – are there any plans to make improvements in this respect?

    • http://lea.verou.me/ Lea Verou

      You mean it takes time to load or it’s not responsive enough while using it?

      • http://typecastapp.com/ Chuck Neely

        Sorry for the late reply Lea, yea I find when working with gradients in particular in Firefox that the app seems to feel a bit slow/jumpy, this is most noticeable when you’re working in the CSS panel you get the little “preview” boxes showing you the colour, measurement etc (love those preview boxes btw). It’s not a major thing really Lea, just something I noticed while using it in FF! Chuck

  • Nick

    I just can’t use Dabblet, it’s too clunky, just not clean… jsFiddle is a lot nicer to use I’ve found.

    • http://lea.verou.me/ Lea Verou

      If you elaborated as to what you mean, this might have been a constructive comment.

  • zaqx

    Have you considered adding the ability for multiple people to edit the same dabblet at once, similar to google docs? We frequently share dabblets back and forth at work when constructing new UI and it gets messy fast with who’s version is the latest.

    Don’t know how I managed before dabblet, it’s a game changer for sure. I forsee a future version of dabblet or dabble successor completely replacing photoshop and the concept of web mocks. You’re brilliant, thanks for making this! :)

    • http://lea.verou.me/ Lea Verou

      Yes, I would totally love having this feature! Unfortunately, it seems to be very hard to implement with dabblet’s current architecture. :(

  • http://beben-koben.blogspot.com/ Beben Koben

    i don’t understand about script, but i love editor like dabblet

    waiting for launch :D

  • Ajay

    Hi,

    I really love this dabblet. I would like to implement a editor with prismjs and dabblet. Unfortunately I could not find a better articule on how to create simple dabblet editor with prismjs syntax highlighter. It would be great, if you can share any document for the same.

  • http://www.ebog.me/ ebog

    Very useful and supportive article. I wish I can do all of
    that in a short period of time.

  • http://www.y8u.org/ Y8

    Improving cross-browser support and Strengthening security making the difference on this news

  • http://www.minecraftgames.info/ minecraft

    I recently started working towards making this happen.

  • http://www.mercubuana.ac.id/ ryditya909

    good posting very intersting