Ruthless Automation

M-x write-something

Neil Patrick Harris Is Amazing

You want to see someone who knows performance? HERE. That’s being a pro - mistakes don’t happen.

UPDATE - Changed link to be the offical video when the other was taken down.

Presenting

I already linked to You Should Speak at JSConf in my recap of JSConf but it’s worth another read. What Adam has done is give a good plan for any sort of speaking in public. He makes a good point that lots of people are not good at public speaking, but it shouldn’t stop anyone from trying. Complete agreement there.

I’d like to extend the thought further: it’s ok to not be good at public speaking, but it’s never ok to not be good at your speech.

I can’t watch a presenter who’s not done adequate prep. It ruins the moment for me when the speaker starts to read a slide, or can’t get past his/her tech, or clearly hasn’t practiced. Darren Kall was my VP when I worked at LexisNexis/Elsevier, and he might have been the best speaker I’ve ever watched, because he understood this rule: a speaker is there to entertain. A speaker might teach, might make you think, might make you disagree, but if they are doing their job correctly, then entertain you. If you can’t entertain, you can’t then engage the audience to to the rest - the teaching, the storytelling, the engagement. It all flows from being an entertainer, which isn’t making someone laugh. It’s the art of making the people in the audience want to pay attention to you more than they want to do anything else. Just like in the movie theater, a good speaker gets you to suspend your disbelief for a while, or at least suspend your other mental processes.

Some thoughts on how to get to that point:

Slides are there to provide a starting point for what you are going to say

If you ever find yourself reading a slide as a speaker, then you need to change the slide or your speech. Slides are a backdrop to the real show, like a soundtrack. They can be very effective once you understand this. Mike Stamm had a nice trick as CSSConf where he put little humorous asides in his slides that he never mentioned. Like easter eggs for the audience. The whole key was that he never called them out directly but let the audience find them on our own.

Your speech has to make sense without your slides, but not vice versa

If you are trying to put a presentation entirely into slides, then you are writing something to be read, not something to be watched. Powerpoint is a lousy tool to give details, a nice tool to give overviews. Your slides don’t have to live by themselves.

If your presentational style depends on any trick, gadget, technology, anything else other than you standing in front of people speaking, it will not be as successful as it could be

Think of watching sports on television. All the additional things you can do while watching - replays, social media involvement, technology tricks to see things up close/slow motion/different angles - they are nothing without the actual sport. Focus on speaking and how you are connecting with the audience, then worry about the rest.

If you have the skill to do live coding/demoing/etc, you need the humility to have a backup plan in place

Maybe I’m harsh here, but I think you ought to be able to jump over to plan B or even plan C if something doesn’t work. You’re a performer, so if you can’t pull it off, you owe it to your audience to have another way to make the point. Assume tech will fail, browsers will not fully clear cache, netowrks will die, and so forth. If you take the time to make sure you can pull it off regardless of the number of Chaos Monkeys present, you’ll be prepared for the really unexpected things that happen.

It’s easy enough for me to say all this as I don’t speak publicly at all, and I admit that I’m terrified of talking in front of others. But reading Adam’s original post has really got me thinking that I should come up with an idea myself, and see about JSConf 2014. Not sure I can commit myself to it, but the thought is there now, and it won’t go away.

JSConf 2013 Days 2-3

Day 1 recap

Regarding the link above - how to use Octopress and want to create internal links w/o hardcoding the URL.

Day 2

JSConf decided to take an extra day between events this year to allow some fun and games. Sheer brilliance to me as a first time attendee, and based on the applause at the end of the conference when asked about it, repeat attendees loved it too. I took the day off to spend with my wife and we did the pool and a trip into town by ourselves. Also met some local wildlife*. Letting the information from the day before sink in, as well as doing some writing and catchup, made the next day so much more enjoyable. Usually there’s a frantic attempt to remember/recap/process everything you learned on day 1 while you’re watching day 2. This was much nicer, and I’m hoping they keep this format.

Some things they provided, either on day 2 or throughout the confernce:

  • Amelia wheels - free bike rides sponsored by Twitter
  • Facebook hacker arcade - video games, air hockey, etc
  • A shuttle downtown the night of the free day to eat/drink/drink/drink…
  • Nodebots and nodecopters

Still wishing that there was a standard hashtag format like this: #conference #speaker #slides. Something to make it a little easier to find slides or links.

Day 3

Much more technical feel to the third day. Lots of presentations were showing code, or delving deep into the innards of their topic. My only complaint is that presenters starting going long and the two rooms got off schedule with each other. You had to leave one room 15 minutes before the end of a presentation to catch the start of another. A quick announcement that things were going to sync up again starting in X minutes would have solved it, but neither staffer I asked was willing to do that w/o talking to the organizer.

Brendan Eich & Toward a language-neutral browser VM

He came in just a little late, but considering he’d flown across the country the day before, I don’t think anyone held it against him. Plus, he’s BRENDAN EICH. I’m still not sure how I feel about web vs native, although I am sure that there are limitations to the web that may or may not be equaled out by the ubiquity (it’s too hard to clear all cookies for just one site, including third party, and the dependency on third party cookies for a lot of sites make it a pain). I have yet to find any web apps that are as good as the best native ones.

I confess, I’m flattered that my 2014 JSConf plans might include yelling at him during his presentation.

  • AAA games - Halo, etc. top end games. Can they run on the web?
  • Recent efforts to make web like native - web audio, webRTC.
  • emscripten - complie c/c++ to js
  • asm.js - native js performance by making a small, fast subset of JK
  • is the web the last compiler target?
  • he just ran unreal tournament in a browser, all JavaScript driver. AWESOME.
  • with large apps, JIT runs into issues and makes mistakes
  • asm.js is a subset of js and very optimizeable
  • asm uses coercion via bitwise operators

Selena Deckelmann & Schema Liberation with JSON and PLV8

Slides and more information on her blog

A technical talk about how you can store JSON data in Postgres. Not being db guy, it’s not clear to me how valuable this is. Seems like the main advantage is you don’t spend a lot of time worrying about schema design.

  • dbadmins have to design schema and there’s tension between this and flexibility of JSON
  • ex - mongodb has flexible schema. dbobjects look like app objects
  • is schema premature optimization? maybe
  • double the storage size when you store as JSON
  • but native methods in postgres for dealing with JSON
  • start by using JSON, then optimize later

John-David Dalton & Perf the web forward!

He’s very passionate about what he does, but what seemed like a humorous attitude towards most library maintainers later felt like it might have had some deeper roots when the Yayquery team roasted him a bit. Not sure of the history here, but it does make me wonder if the optimizations he recommends are valuable regardless of use case, or if they are somewhat academic. Either way, understanding how the code is written is always a good thing.

Hoist out .call and .apply

  • Basically if you don’t pass a this to the call function, just return the callback versus actually binding to the scope
  • Make a ‘createCallback’ function that checks as above

Avoid binding

  • Coerce a function to a string, using Function.prototype.toString and regex for \bthis\b (can error if ‘this’ in comments */
  • Then check if the function uses this
  • Tf it doesn’t, doesn’t need to bind

Coerces with care

  • Don’t need to slice if you are looping over arguments like an array
  • Can just start at 1 if you know it’s an array
  • Don’t have to flatten, can use concat
  • Lots of array details in here I didn’t fully follow

Sugar in moderation

  • Chaining has a cost since it’s the non-common case
  • _ and lodash are optimized for non-chaining
  • Others are optimized for chaining (mootools)
  • Lazy.js optimizes for chaining by just adding items to a queue and only giving back what you want

Questions

  • What’s the general use case? The general use case is what’s shown in tutorials and questions, or how you promote using it.
  • When using createCallback, why not prototype.bind vs createCallback? it’s often slower.
  • Minified code can change the perf and actually be slower. gotta test both.
  • Need a perf suite for your library - use benchmarkjs.com

Domenic Denicola & Promises/A+ Was Born

Slides and notes

Very passionate speaker, and a good talk. Generators seem very interesting, need to follow up more.

  • We turn primitives into patterns
  • Continuation passing style - you just keep handing the logic of your program to the next function.
  • You just keep wrapping stuff in a function.
  • turing tarpit
  • Promises give you back async versions of return and throw
  • Generators are in chrome canary
  • q library for node
  • Not sure of his point about generators and promises
  • Prommises are objects representing objects from a different time
  • With generators, promises can be on a remote computer
  • CommonJS Promises/A - $ didn’t implement correctly
  • kis kowal q library
  • open spec development: cause, people, code, contract, setting. Need all of these.
  • code before prose

Peter Van Der Zee D & Live Recompilation of Running JS

Github repo for his library Recompiler

I wasn’t going to attend this one at first, but there was some equipment failure and he presented during lunch instead. Very cool concept about how you can make a library that allows live code editing that reflects immediately. However, he still had some issues that kept all his demos from working. Personally, I believe you need a backup if you’re going to live code. Have something you can show that works no matter what.

YayQuery & Yay Yay Yay Query

So effing weird and funny.

Ben Farrell & Using the Microsoft Kinect with Javascript OR Sweatin’ to the Web

Winner for best dressed presenter. He tried to use gestures for his presentation, but they stopped working. Then they started again. So a lot of the time was spend messing with that. Wish there had been a way to turn them off so we could have concentrated on the talk instead. I think it threw off his message a bit.

Adam Baldwin & Builders vs Breakers

Enjoyed this talk as a communication focused talk. The core of everything we do as people is communication, and his stories were interesting. Also, this. Had a nice chat about the talk, travel, and kids.

  • @adam_baldwin
  • Work
  • Github repos
  • Slides of Builders vs Breakers

  • Builders are his audience
  • Didn’t do a good job talking to them at first
  • Had too much of a breaker mindset
  • Found a basecamp issue, told them
  • They said we need that as a feature
  • he made video saying xss is not a feature and basecamp got killed for it
  • breaker gets a high from finding sec bug, builder gets a low
  • Important to realize both sides of the story, regardless of which side you are on.
  • Node Security Project - audit every npm module

SECURITY.md needed in repos

  • how to report
  • expections
  • list of humans

Adam Solove & Constraint programming in the browser

Adam just published this You Should Speak at JSConf, and it captures some good thoughts about JSConf itself. It’s really made by people like him who decide to speak and are willing to get up there and lay themselves out. This was an interesting talk, because I could see date scheduling based on constraints something we might get into at work. Best line from his entire presentation: ‘If we can express the problems we have in terms of a problem domain that someoe has already written, we can get FAST answers.’.

  • @asolove
  • Original cassowary code
  • His Github Fork

  • Could have written same js code 15 years ago with CGI
  • Web apps are same as forms - you decide what inputs to take, and what outputs to generate
  • Instead, make all things both input and output, and just use constraints between them
  • Constraint programming - write relationships, not procedure
  • Think addition vs algebra - addition is just a function, algebra means you can either solve for all or define relationships
  • We don’t know what users will do with inputs
  • C only works when things are linear and numbers
  • Bret Victor scrubbing calculator
  • colybra
  • minikanren/core.logic
  • If we can express the problems we have in terms of a problem domain that someoe has already written, we can get FAST answers
  • Eventually, we won’t be smart enough to write these things

Chris Williams

Things wound up with a general Q&A. I cannot wait to come back here next year.

  • jsconf 6 is a go, and will be back here at Amelia Island.
  • @pamelafox - ideas for next year, wants interview techniques (both sides)
  • @cowboy - can we have panels? @voodootikigod - prob not
  • how are presentations chosen -
  • can presentations have little more descriptions/list of libraries
  • how do we keep these conversations going? irc, fb, google hangout, google plus, physical hangouts, meet each other. beer.js, ming.js
  • keep the second day going - free day with activities
  • lots of people want to participate, but aren’t physically here. How to help?
  • will be jsconf brazil, australia, argentina, south africa, asia
  • why no live stream? because we buy tickets and why let someone who hasn’t in. no one ever says “oh my god the live stream is great”.
  • use coatella? coachella?
  • carter - he put on jsconf in NW (cascadia js). for regional conferences - what should be just like jsconf, what should be different
  • remy - 30 minute format is great, easy to digest.
  • the SA conf in columbia - you should highlight local talent, that gets the local community going
  • family friendliness is great
  • some way to meet people beforehand? tried google hangouts
  • some way to keep broadcasting the local stuff
  • jsconfeu sept 2013?

Footnotes

  • Started off by embedding that tweet, but that’s an awful break in the flow of a post. Think I’ll stick to just linking from now on.

Internal Links to Posts

For anyone else looking, you can do something like this in your posts:

1
[Link Text to Your Own Post]({% post_url YYYY-MM-DDDD-post-title-here %})

if you add the Jekyll post_url plugin .

However, as of the publish date of this post, Octopress sets the default markdown parser to be rdiscount. You’ll get an error parsing this code in the atom.xml file. However, you can change the parser to kramdown as detailed here by Joshua Gall.

Make the change in _config.yml:

1
2
# markdown: rdiscount
markdown: kramdown

JSConf 2013 Day 1

(First thoughts, still a little rough. But every time I do this, I find that getting something out there motivates me to make it better. But if I wait till I think it’s done, it just sits there.)

Overall

  • The cookout last night really was just like a family reunion.
  • I want to bring my kids next year.
  • Spent time by pool today, even there people on laptops.
  • Offday in between is brilliant. This is what (to me) made it a family fun event. I can see bringing my kids next year.
  • Nice mix of fun stuff, process, and tech
  • Snacks/food/organization great.

Remy Sharp & WebRTC

In a nutshell, you don’t need to fully understand something to use it. Just try it and see if it works. Slides

  • Web RTC is pure peer to peer
  • can stream video or do sockets over peer to peer
  • can do UDP across this?
  • Bleeding edge changes under your feet, so expect to spend longer getting it working.

Angelina Fabbro & JavaScript Masterclass

You are not special, but in a good way. No one is born an expert, we all have to learn. Slides

When you are not a beginner

  • can you use the fundamentals in any language, you aren’t a beginner
  • do you write from scratch
  • you look inside the libraries you use

When you are not an expert

  • you can’t explain what you know in a clear way
  • you are not confident debugging
  • rely on references too much

How to be an expert?

  • ask why all the time
  • teach or speak
  • experiment (code doesn’t care)
  • have opinions
  • seek mentorship
  • program a lot
  • stop programming and do something else for a while
  • write js
  • write another language
  • fall in love with your process

Angus Croll & Literature/JS

Funny approach to how famour authors might have written JavaScript, available on github.

Brandon Dimcheff & Title: Down The Rabbit Hole: Chasing bugs from the browser to the backend

A nice presentation on debugging a particular problem, with some good humor. No slides.

  • graph everything
  • logs in JSON format
  • jsontool for npm
  • do the stupidest easy thing that works to recreate the issue (he pulled his ethernet cable out to simulate network flakiness vs using iptables).

Peter Flynn && Performance Tuning Secrets

Adobe guy with some nice Chrome debugging tips. I just captured some things to look for in the docs vs explaining them.

Rendering tests/tricks

  • console.timestamp
  • console.time
  • console.timeEnd
  • remote debugging api
  • telemerty framework lets you automate ui actions
  • topcoat uses this for their testing and does d3 visualizations
  • chrome://tracing
  • close all tabs but the one you want, find which process ID you want

Profiling

  • can see memory leaks and # of dom objects
  • acn see gcs that block execution
  • can diff memory snapshots
  • console.profile
  • console.profileEnd
  • can overlap these
  • performance.timing
  • performance.webkitGEtEntriesByType(‘resource’)

Brian Cavalier && Connecting your shiz.js with AOP

A very interesting talk about how to construct apps w/o the intervweaving of dependencies. The really nice part is that every variation is coded and on Github. This is probably one my my top takeaways to dive into deeper. Didn’t take good notes because I was caught up in the actual code he was showing, and how things worked. But worth a deep look.

  • Aspect Oriented Programming
  • Aspect - encapsulated unit of behavior
  • AOP lets you use methods as events

Dan Webb & Flight.js

New UI framework for events from Twitter.

  • We want to decouple views, models, etc
  • What do we have in the browser? We have the DOM.
  • So we use events since those are there.
  • Flight only worries about the events

Raquel Vèlez & AI.js: Robots with Brains!

This was a fun talk, just to see someone who’s so passionate about what she does. In the end, sort of a call to arms to say that we can build robots without needs thousands of dollars, government backing, or hugely complex environments. “Get a PhD vs Get Started”. Her robot project is here and here are the slides.

Rebecca Murphey & Optimizing for Developer Happiness

Developer delight - the sooner devs want to switch to using your project and/or your ‘better’ internal code, the more money you can make as a company. So how do you make those devs want to switch? Slides

  • Provide a path to get up to speed
  • Provide points of entry for junior and senior dev
  • Have few surprises
  • Have isolated complexity
  • Easy development and debugging
  • Nothing more difficult that it should be

Use asssertions - we expect that X is Y at this point. in prod, these are no-ops

log the lifecycle - should not have to console.log to know what happened

  • console.group and console.group.end
  • you learn the flow and know where something broke

  • Eliminate tempation - don’t give people a place to make mistakes. ex - don’t give them a global var to shove stuff into
  • Have code for every concept
  • Automate everything. make an internal tool to get data in one click.
  • Document the things code can’t tell you (how to make new feature, how to fix things, where to find things)
  • Document the things you don’t want to (ex, things you agreed on when a small team)
  • Put docs in the repo - if it talks about code, it goes with code.
  • Measure progress
  • grunt-complexity

ReactJS

New framework tool from Facebook. Link. Note to self, I need to separate my dislike of Facebook from their tech.

  • how do you structure things
  • MVC, MVVM, MVW
  • Model View Whatever
  • Models are the common thing
  • Observable models encourage mutation
  • Anytime data changes, best thing to do is nuke the view and recreate
  • When you models change, react figures out the smallest dom mutation and make it happen for you.

Erich Gamma & TypeScript

Typescript is a superset of JS and looks impressive. From talking with a coworker, looks like this is something that a middle-tier dev could get up to speed on immedaitely and crank out JavaScript and UI code really quickly. I didn’t really give his presentation justice as it was the end of the day, so this deserves a deeper look.

CSSConf 2013

Conferences are not a huge part of my career - I’ve been lucky enough to attend several ‘An Event Apart’, um, events, usually in Chicago, and we’ve done some internal get-togethers at various jobs. So CSSConf has been a great introduction back to this world, and I’m very happy I switched my flights and hotel to attend. It was held yesterday as a preliminary conference to JSConf at Amelia Island in Florida. I met several people who only came for the one day event and aren’t doing JSConf. My advice so far is that it looks to be a wild week, so next time around try the whole thing.

The Venue - Omni Hotel on Amelia Island

Very very nice - I’m writing this 100 yards from the beach (also far too early, I’m cursed with an internal clock that clicks on usually by 5 or 6). Rooms are nice, but the wireless is a bit slow and spotty - could just be my room being at the end of the hotel.

Social

Great, great, great. The sponsors outdid themselves with good food and drinks - Kickstarter did a short meetup before the main party that was really nice, MS sponsored the beach party, and overall the opportunities for meeting people were wide open. Wish I’d done even more, even if it meant just going up to people and introducting myself.

Presentations

This isn’t in depth, just trying to capture the flavor of what each speaker did. I spent a lot of time on twitter sharing some links and thoughts after each presentation (less as the day went on). ONe thing I noted along with others I talked to - this was heavily slated to the side of programmatic interactions with CSS. Only two presentations dealt with pure CSS as far as writing it (Lea Verou on border-radius and checkboxes by Ryan Seddon). I’m guessing that the conference organizers went that route knowing most people were already coming for JSConf and might be more interested in the programming side of using CSS.

Pamela Fox

Great speaker and a good choice to open up. Funny, specific, and gave a good story to follow along to. She sat at our table and was open to discussion all day about different topics. Slides/more info

  • Don’t use css class names in JS, use data-attributes
  • Create your own class names that extend bootstrap in LESS
  • Use a prefix.css variable when instantiating objects so you can specify it on creation
  • Needle - selenium and Nose. does screenshots against known good one and diffs them

Tim Hettler

Very interesting thoughts on how to write your LESS/SASS that takes PSD values but writes out CSS values. Slides/more info

  • Use preprocessor to create design elements vs reading colors/gradients/etc by hand
  • Test color lightness and use the correct font color if the bg color is light or dark so never have to manually set the text color, it happens automatically based on bg color
  • do trig calculations in compass to turn PS gradients into box-shadow css
  • github library for doing this - need link
  • can you pull info out of PS programatically?
  • LayerMiner
  • Compass/ps drop shadow
  • Compass/ps gradient overlay

Jeff Burtoft

Good speaker, but depended on his slides for his humor - I think he could have carried it off himself. Flexbox looks really cool though. Demo

  • flexbox
  • flexbox is parental control - set up rules for the kids of the element
  • media queries + flexbox to change layout

Alex Sexton

Really technical talk about AST parsers. In the end, not sure what the use case is, unless it’s like ‘grunt watch’ without having to recompile? Slides/more info and github link.

  • AST hacking
  • see rework by TJ H.
  • demos on alex’s site /talks

Lea Verou

Great presentation on border-radius that blew me out of the water on what I thought I knew. Seems like the W3C would be well served to find more people like Lea who can evangelize the art that’s hidden inside CSS. There’s a programmatic beauty to what you can do with it that would interest coders, but we need to see it exposed more. (Note to self, don’t bother speakers after they finish - talk at the bar.) Slides/more info

  • br expressions are greedy - if you don’t use 4, then the ones you use try to apply as much as possible, as in top left, then top right and bottom left, then bottom right
  • browsers scale every corner by same amount when scaling radius - keeps the ratio between them
  • br can take 2 different values - vertical and horizontal
  • webplatform.org
  • look at cssconf site for header image, done with this.

Topcoat

Christopher Joseph and G. Torres from Adobe. An opensource UI framework. They have a lot of things going now that are NOT the old Adobe, and it’s nice to see. The benchmark site looks useful. Hated how one person talked while the other stood there for 10 minutes, though. Awkward.

Thomas Reynolds

3D everywhere, was pretty cool to watch. Didn’t take good notes here, but need to revisit this. No link to slides yet.

  • use CSS where you can for 3d because you keep your content, vs drawing with canvas and so forth.

Dean Ashworth

From Paypay, and I’m wondering if being a sponsor meant they pushed to have him talk? He read from his script word for word, makes it really hard to watch. Not sure why, but I hope this was just a bad mix of circumstances and he can improve in the future. But his talk had nothing at all to do with CSS, and it was the one sour spot all day.

Ryan Seddon

Very cool CSS demo about how the checked attribute can give you state with CSS only. I could see this being used in a small web app. Slides, Github, Github site.

  • still buggy - needed empty onclick for mobile devices
  • his presentation was built using what he talked about

Mike Stamm - DOMKata

One of the best of the day, even though it wasn’t purely about CSS. Mobile development. He might have been the most polished speaker in his way - a fairly intense talk, so you have to like that sort of thing to get into it. I’ve seen speakers who are very lighthearted and accomplish the same goal of getting the audience interested, so it works both ways. One trick I really liked is how he put humor on the slides, but never read that part. He let us discover it on our own. No slide link yet.

  • best quote - viewport is a strechable/moveable hole you view a mobile website through
  • WSJ will eventually take their mobile website to be THE single website as they develop it up for different size screens. Truly mobile first.

Val Head on Responsive Typography

Another really good speaker. Might have been the only keynote user? Wish I had captured more notes on this, it’s another one to revisit. How to size your type for different screens for best reading. No slide link.

  • Good type puts people in a good mood.

Pure from YUI

  • Pure CSS
  • Eventually all of YUI will use pure
  • Need to look at their build process

Tom Witzius & Nat Duce on browser jank

From the Google Chrome team. You can tell they’ve spoken a lot together, and know how to play it. Sort of the classic comedy duo. Lots of good info about how you can test when you will have repaint events using dev tools. Again, got distracted and didn’t get good notes. No link.

Nicolas Gallagher

Really interesting. In a nutshell, the way we build things right now sucks, and dogma is never good.

  • BEM for naming
  • No element should have to know what it lives inside - the classes on that element are standalone from the parent
  • This way, you can never worry about inheriting from some random parent.
  • We’ve gone from ‘do not use extra markup and be semantic’ to ‘we will use extra markup and presentational names to make native widgets’
  • Development has gone full circle in terms of what we say to do
  • Shadow DOM shows how native templates are used to build elements on page
  • Native widget will give encapsulation and templating w/o needing libraries

Improvements and suggestions

  • Projectors were used to display on two screens, right and left. The right side one was trapezoidal and it annoyed me all day as it cut off some display. Next year, hope they can move to a better system. I’ll be disappointed if JSConf has the same issue.
  • Not sure if they did this or not, but provide power adaptors on the podium for speakers. Couple of them brought their own up there and took a few to get set up.
  • The wifi seemed to be way to aggressive on renewing leases, but got better over the day. Or I just stayed active on my laptop more.

Volo for Front End Dependencies

(Updated 2013-05-30)

Volo is how we pull in front end repos for projects at work. Think npm but for front end libraries. You can give it a package via a github repo version, specify a version, and then run <div class=’bogus-wrapper’>

<div class=”highlight”><table><tr><td class=”gutter”><pre class=”line-numbers”>1 </pre></td><td class=’code’><pre>volo add -f github_repo/version</pre></td></tr></table></div>
</div>

which will pull the code in for you via a github zip file and drop into the folder you ran the command in. The downside of volo is that there’s no idea of keeping dependencies separate as you pull in other projects. So if projectX wants jquery 2 and projectY wants jquery 1.9, you have to do some extra setup, or when you pull projectY into projectX using volo, projectY will also download the version of jquery it wants, and will overwrite the version projectX already put there.

I’ve working on a setup so that at the top level of our projects, we could declare only a volo URL in the package.json, with a base of vendor/, and a directory declaration set to true. This will prevent allow another project to pull in our files, but wrapped inside a folder inside vendor/. This depends on projectY having a single distributable zip file that other projects can grab. In addition, I’m looking at constructing the project so that you can use either an all.js file for projectY that only loads the project code it needs to run from projectY, or an all-withdeps.js file that contains all code needed to run the project code (i.e., bundled dependencies). This way, if you are using some common components, you can pull those in by themselves and just give require paths, or you can just grab the single file that will run w/o needing anything else.

When we initially setup projectY, we will have 2 package.json files, one at the top level like so (only showing the volo part here) <div class=’bogus-wrapper’>

<div class=”highlight”><table><tr><td class=”gutter”><pre class=”line-numbers”>1 2 3 4 5 </pre></td><td class=’code’><pre>// skipping parts of the file "volo": { "url": "https://github.com/Company/projectY/{version}/dist/projectY.zip", "type": "directory" } </pre></td></tr></table></div>
</div>

This file specifies what zip file will be sent when others use volo to add projectY.

Then there is a package.json file inside vendor/ that will define what dependencies projectY has. <div class=’bogus-wrapper’>

<div class=”highlight”><table><tr><td class=”gutter”><pre class=”line-numbers”>1 2 3 4 5 6 7 8 9 10 </pre></td><td class=’code’><pre>{ "volo": { "baseDir": "./", "dependencies": { "jquery": "github:jquery/jquery/1.9.1", "require": "github:jrburke/requirejs/2.0.6", "underscore": "github:documentcloud/underscore/1.4.4" } } } </pre></td></tr></table></div>
</div>

Then we run the following for projectY: <div class=’bogus-wrapper’>

<div class=”highlight”><table><tr><td class=”gutter”><pre class=”line-numbers”>1 </pre></td><td class=’code’><pre>cd projectY/vendor && volo add</pre></td></tr></table></div>
</div> Now you have all the dependencies for projectY inside projectY/vendor/. You build your distributable package for projectY using these paths.

Now projectX does the same thing - 2 package.json files, one at the top level and one at the vendor/ level. Top level defines projectX itself, vendor/ level says what dependencies it has. So projectX/vendor/package.json might look like this: <div class=’bogus-wrapper’>

<div class=”highlight”><table><tr><td class=”gutter”><pre class=”line-numbers”>1 2 3 4 5 6 7 8 9 </pre></td><td class=’code’><pre>{ "volo": { "baseDir": "./", "dependencies": { "jquery": "github:jquery/jquery/1.9.1", "projectY": "github:Company/projectY/version" } } } </pre></td></tr></table></div>
</div>

Now you have projectY pulled into projectX, but in a way that will never override the versions that projectX might need. Any dependencies that projectY has will get dropped into projectX/vendor/projectY/vendor/. This means you could pull in 2 different versions of a library (you’ll have to handle global conflicts on your own), or you could just use projectY in such a way that you point to the projectX version of any dependencies, assuming that’s feasible.

Currently there is an issue with private repos and volo that I’m trying to help fix - see the github issue here. Volo currently can’t work correctly if the repo you are trying to get is a private repo, but you can work around this with a volofile that deletes the extra code.

Why It Does Not Matter How Good IE Is as a Browser

Spent 2 hours getting a VM with IE to be able to talk to a local node app. Had to turn on SSL in the app because of XDR restrictions, then debugging was a nightmare. Can’t see netowrk traffic. Install Fiddler. Oh, install .NET as well. Then try again. Error on line 67, character 7. Well. that’s helpful. Ok, maybe that method isn’t supported? Yep, that’s it. Change code, try again. Oh, first stop debugging, then reload, then start debugging.

IE10 and higher could be the fastest, leanest, most versatile browsers ever created. But the lack of developer tools in IE is what killed the chance of it ever being relevant again. I know of 1 person in my entire development career who builds for IE. And the only reason he does it (supposedly) is that if it works there, it will work on the other browsers w/o any issues. So a least common denominator approach.

Every other dev loads up a site to make sure it’s decent, but I don’t know any that take the approach of fine-tuning things to be ideal there. It’s just too much work for what’s an automatic workflow in other browers.

Getting Octopress Running Again

Hello world. Been about two years, hasn’t it.

In getting this blog set up again for actually writing, ran into some homebrew and rbenv issues. I put homebrew directly in my ~/git folder to match my work laptop setup (restricted rights on that machine, so it’s easier). Butafter intalling rbenv via homebrew, the system doesn’t pick up the changes to the PATH. I have to manually add the <div class=’bogus-wrapper’>

<div class=”highlight”><table><tr><td class=”gutter”><pre class=”line-numbers”>1 </pre></td><td class=’code’><pre>~/git/homebrew/var/rbenv/shims</pre></td></tr></table></div>
</div> directory to my path. Once that was done, then I was off and running again.

The rbenv process is killer when compared to how node does it. Every dependency local so you never worry about overwriting one. It makes for bigger repos, but completely self-contained ones. I considered a node package for the site, but Octopress is so good otherwise that I couldn’t pull the trigger. I want my home stuff to just work - I spend enough time getting stuff to work correctly at work that I don’t want that to be my home experience too.