Grunt throttle →
Clever Grunt plugin to simulate a very slow internet connection during web testing. This should be extremely useful for high weight pages, especially with those where large images do the heavy lifting.
Clever Grunt plugin to simulate a very slow internet connection during web testing. This should be extremely useful for high weight pages, especially with those where large images do the heavy lifting.
Emmet LiveStyle is a Chrome extension paired with a Sublime Text plugin that transforms your CSS workflow. Install both tools and you get no BS live bi-directional CSS editing. To put it another way, either tweak in Chrome DevTools, your Sublime Text CSS file or both, and the changes immediately take effect on your page.
Admittedly LiveStyle isn’t perfect. First you have to be committed to Sublime Text as a text editor (which I’d highly recommend, but it isn’t for everyone). Setup can be sometimes annoying; when you switch to the tool in DevTools you’re often forced to assign CSS files you’re editing manually. Also it’s in beta, so expect occasional stability problems. But for the most part when you start getting in a CSS editing groove it’s pretty awesome.
A common hassle for any developer who writes CSS3 is knowing when to prefix (e.g. -webkit-transition, -o-transition, etc.). When does a vendor fall out of date? Cutting edge Sass developers already have a pretty clean solution for this via pregenerated mixins like Bourbn or their own custom solutions. But if you don’t have that, this Sublime Text plugin is the next best option. Check it out.
Chardin is a smartly thought out jQuery plugin that draws overlays on existing web elements, accompanied by optional instructions. It looks especially useful for interactive help within web apps.
Very slick jQuery based plugin that adds drag and drop based image uploads, along with built in image previews. As author Matias Meno points out, there are other options, but there is a bit of spin and compactness here that is really interesting.
Foggy is an interesting jQuery plugin for blurring page elements. Yet I can’t help but be concerned about the performance implications for browsers that don’t support the native CSS3 blur (-webkit-filter: blur) attribute. Making several copies of an HTML element to be reinserted in the DOM is often costly.
I’m very, very late to the party on this one, but this is a great jQuery plugin from CSS guru Chris Coyier and the web design shop Paravel. If you dig fluid width video embeds – something becoming fairly essential with modern responsive design – it’s worth giving this plugin a look. I recently incorporated FitVids.js into an experimental Tumblr theme I’m working on as a side project. Worked great and implementation was straightforward.
LiveReload is an app that does exactly what it sounds like: Apply CSS edits and image changes in your web work live; no annoying manual reloads of your web page any more. I while ago I gave an earlier version of this tool a whirl, but it was hard to set up; lots of command line calls and Ruby gems.
Not anymore – one $10 Mac App Store app and a simple Chrome extension and I’m ready for business. I’m a bit embarrassed that I didn’t discover and start using this tool earlier; I’d highly recommend checking it out if you’re a web developer.
I love keyboard shortcuts but adding them to web sites and web apps can be painful. Different browsers handle slightly different syntax, and the process of looking up key codes can require some trial and error. Enter Mousetrap, a tiny (3kb minified) Javascript library where you invoke natural syntax (e.g. ‘4’,’command+k’) for keyboard bindings. No external library dependencies either.
Looks like a very slick, compact plugin to generate CSS3 transitions with jQuery calls. Part of me naturally questions why to not just write the CSS3 transitions directly, but this could work well with some sort of Modernizr-esque graceful browser degradation. Browsers that have CSS3 animations rely on jQuery Transit while legacy browsers get more traditional jQuery-based animation methods.