Profile

Cover photo
Jan Miksovsky
Worked at Cozi
Lives in Seattle, WA
1,511 followers|88,120 views
AboutPostsPhotosYouTube

Stream

Jan Miksovsky

Shared publicly  - 
 
 
We’ve rewritten the component.kitchen backend server to rip out a popular templating language and replace it with plain JavaScript functions. Recent language improvements in ES2015 have, in our opinion, made it a sufficiently capable general-purpose language that we’ve dropped use of a special-purpose template language. As we began a rewrite of our site, we were inspired by our recent work using plain JavaScript functions to create web components and decided to apply the same philosophy to our backend as well.
We've rewritten the component.kitchen backend server to rip out a popular templating language and replace it with plain JavaScript functions. Recent language improvements in ES2015 have, in our opinion, made it a sufficiently capable general-purpose language that we've dropped use of a ...
View original post
1
1
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
 
We think it’s generally necessary to use some sort of framework to develop web components, but that framework may not have to be monolithic in nature. Instead, the framework might be built entirely as mixins on top of a kernel that enables mixin composition. Rather than invoking a framework’s class constructor, one would simply compose the desired mixins together to create an instantiable web component.
We think it's generally necessary to use some sort of framework to develop web components, but that framework may not have to be monolithic in nature. Instead, the framework might be built entirely as mixins on top of a kernel that enables mixin composition. Rather than invoking a framework's ...
View original post
2
Justin Fagnani's profile photoJan Miksovsky's profile photo
2 comments
 
Hi Justin! I think you’ve got me about 75% convinced to do this. I like the elegance of defining mixins as functions. We're debating the possibility of changing our kernel and defining mixins this way.

That said, I'm not sure that simply agreeing that mixins are functions that accept and return a class presents a complete solution for us. As I mentioned in that earlier thread, the vast majority of our mixins' properties and methods need to be composed with those of that base class — they can't simply overwrite the base class' implementation. So, on its own, simply redefining mixins as functions doesn’t go far enough. In particular, it doesn't guarantee that a mixin-as-function created by someone else would be applicable in our environment. Without that guarantee of default behavior, interop seems unlikely. While the Composable architecture we describe is heavier weight than we'd like, it does enforce default rules for composition that meet our needs.

As you pointed out earlier, a mixin-as-function that wants to compose members with its base class has the option of doing so via super. That's possible, although as I mentioned, in practice this gets cumbersome. So I think the question of whether we should adopt this approach boils down to whether composability should be the default result (imposed by the Composable factory) or a conventional result (where the burden is on the mixin author to write their mixin the right way).

One compromise would be to convert Composable to a helper function for mixins. That is, the mixin function extends the base class to create a subclass. Before returning the subclass, the mixin invokes Composable on the subclass, which does its comparability operations, and returns the composed result.

let MyMixin = (superclass) -> Composable.compose(class extends superclass { … });

So a mixin author that wants to offer composability would have two options: 1) take care of composability themselves, 2) use the Composable helper.

As an aside, I'm curious whether you're interested in this mixin question as it applies to web components, or as an general issue of JavaScript technique. If we were to make this change, does that influence your interest in using and writing component mixins this way? I ask only because there might be follow-up questions in applying these ideas to components specifically.
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
A quick experiment to create #webcomponents  using #Polymer  0.8-preview and #es6  class syntax. Feels good to me.
polymer-classes-in-es6 - Create a Polymer custom element using ES6 class syntax.
2
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
Our new web components tutorial is up!
 
Looking for a quick introduction to #webcomponents? We put together an interactive tutorial that covers all the basics. It runs in your browser, so there's nothing to install, and works in all the modern browsers. We wrote it for a general audience — not just for hard-core front-end devs, but for anyone who's familiar with HTML.
Supercharge your HTML powers with web components: A quick, interactive tutorial. Web components are a new HTML technology that makes it much easier to create great web sites and apps. This interactive tutorial will teach you the basics of using web components. Each short lesson in this tutorial ...
View original post
4
3
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
Speaking at the +Polymer Polytechnic event in Seattle this past weekend was a blast!
 
Event Recap: GDG Seattle Polymer Hackademic

Venue: Google Seattle | Nov 14, 2014 | 8:30 - 17:00

85 online registrations.
65 attended in person | 5 watched live stream | 50+ viewed talks on YouTube.

Attendees learned getting the most out of web components requires a change in mindset. Component Kitchen founder Jan Miksovsky presented both an introduction on Web Components, and a more advanced talk that assumes basic familiarity with web components and Google’s Polymer framework and a set of principles for creating components that can quickly be remixed and adapted in a variety of applications. 

Each of the Jan's talks was followed by a hands on Polymer codelab, and additional hacking. Most attendees choose to create their own polymer component. We wrapped up the day with demos. This including an Etch-A-Sketch and Auto-Completion on big data list coded in Polymer and shared on github.        

8:30 am Arrival and registration 
9:00 am Web Components 101 
10:30 am Coffee break 
10:45 am Chrome Dev Editor and Polymer Application - Code Lab 
12:00 pm Lunch 
1:00 pm Designing Web Components for Reuse  
2:30 pm Polymer Apps and Mobile Web Development  
3:30 pm Q&A 
4:00 pm Closing

Photos - https://plus.google.com/111739836936169749229/posts/89keeYoJsMC
Event - http://www.meetup.com/seattle-gdg/events/155658502/ 
Video - https://www.youtube.com/channel/UCWfeS6EKrOrq1YfzTtZJfug

#report #gdg #Seattle #itshackademic , #devfest14 , #devfest #polymer  
View original post
2
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
My latest set of contributions to the Basic Web Components project pertains to creating calendars.

The moon phase calendar was fun to write, although it proved trickier than expected to find a simple JavaScript calculation of moon phase. Most of the moon phase calculations I could find are based on a BASIC program listing that appeared in the March 1985 issue of Sky & Telescope magazine.
3
Clayton Watts's profile photo
 
Awesome! Having just dipped my feet into various globalization issues recently, I can really appreciate the huge benefits that having a general-purpose, wide-audience component like this will provide!
Add a comment...
In his circles
94 people
Have him in circles
1,511 people
Yev's profile photo
Ashish Salve's profile photo
Geeks and Humor's profile photo
Omran Info's profile photo
David Epstein's profile photo
Martin Olsson's profile photo
Chris Moyer's profile photo
Bala Iyer's profile photo
Flora brk's profile photo

Jan Miksovsky

Shared publicly  - 
 
 
We like the idea of defining a mixin as a function that takes a base class and returns a subclass with the desired functionality. We like this so much, in fact, we've changed our nascent core-component-mixin project to use mixin functions.
In response to our last post on building components from a loose collection of mixins, a helpful commenter referred us to another mixin library he had released called mixwith.js. That library treats mixins more as a pattern than a thing. In that pattern, a mixin is simply a function that takes a ...
View original post
2
1
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
 
Web components are a great way to package user interface behavior, but they may not be the most interesting fundamental unit of behavior. There are certain aspects of behavior which you'd like to be able to share across components: accessibility, touch gestures, selection effects, and so on. Those things aren't top-level components in their own right; they're abstract aspects of behavior.

If we imagine a web component as a molecule, what's the equivalent of an atom? That is, can we decompose a web component into a more fundamental coding unit?

We've been searching for a way to quickly create web components by composing together pre-defined user interface behaviors, and we have some progress to share on that front. Web components are a great way to package user interface behavior, but they may not be the most interesting fundamental ...
View original post
2
1
Jan Miksovsky's profile photoJustin Fagnani's profile photo
7 comments
 
Sure thing!
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
Have you ever wanted to subclass #webcomponents, where the subclass should be able to fill in visible parts of the base class? After two years of waiting for progress at the standards/browser level, I may have finally found an approach that hits the key criteria. As a bonus, the solution itself can be cleanly wrapped up in a +Polymer component.

I'm interested in feedback on this answer; please give it a try!
base-template - Allow a subclass to fill in slots in a base class' template.
5
Justin Fagnani's profile photo
 
Yes, I've wanted to do exactly this a few times. I'll check it out!
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
 
We're happy to help make the web more accessible. A list box component in the open source project we sponsor, Basic Web Components, was recently upgraded with built-in ARIA support. We strongly believe that the ability to finally share UI components will change the economics of investments in fundamentals like accessibility. Those who understand how to do things like accessibility right can embody their knowledge in sharable code that can benefit everyone.
This review focuses not on a component, but an aspect of a component called basic-list-box. Component Kitchen released that component under the aegis of the Basic Web Components project. In our reviews, we want to avoid focusing too much on our own work, but in this case we can happily feature a ...
View original post
4
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
We've started writing a new series of reviews about #webcomponents on our redesigned Component Kitchen company blog. Our goal is to highlight interesting work, inspire people, and help them discover components they can use in their own apps.

An important design goal for me is that each review be able to include a simple demo. This turns out to be a lot harder than it sounds! There's a big difference between simply looking over someone else's code and having to actually install, understand, and use it. Nevertheless, it's exciting to see the activity in the industry.
Welcome to Component Kitchen, a place to learn about the new web components features in HTML that will transform how you create web apps and sites! The following Staff Reviews look at web components we think are notable: they're good examples to follow, or they solve a common problem, ...
1
Add a comment...

Jan Miksovsky

Shared publicly  - 
 
Another component I've contributed to the Basic Web Components project is a standard single-selection list box called basic-list-box.

The conventional web browser list box UI has, somewhat stupidly, assumed that the only reason you'd ever want to use a plain list box is when soliciting multiple selection. If you use the select tag to create a single-selection list in HTML, the universal browser answer is to always show the list of a choices as a dropdown list. The choices aren't even shown until the user interacts with the dropdown.

That's absurd. While dropdown list boxes have their place, plain (non-dropdown) list boxes are an equally (if not more) important UI for selecting from lists. There are numerous benefits:
1) The user can easily see the choices.
2) It's clear that they have a choice to make (as opposed to a dropdown, which obscures the presence of alternatives).
3) Mouse selection is faster.
4) Keyboard selection is less fussy.

If you've got the space for a plain list box, and you want to encourage the user to make a selection, consider using a plain list box instead of a dropdown. Now you can do so easily with a web component.

Bonus: Good keyboard navigation!
Another bonus: Show any kind of thing as a list item, not just text strings!

Web components FTW.
3
Add a comment...
People
In his circles
94 people
Have him in circles
1,511 people
Yev's profile photo
Ashish Salve's profile photo
Geeks and Humor's profile photo
Omran Info's profile photo
David Epstein's profile photo
Martin Olsson's profile photo
Chris Moyer's profile photo
Bala Iyer's profile photo
Flora brk's profile photo
Places
Map of the places this user has livedMap of the places this user has livedMap of the places this user has lived
Currently
Seattle, WA
Work
Occupation
Software Designer and Developer
Employment
  • Cozi
    Software Designer, 2005 - 2011
  • Microsoft
    User Interface Architect, 1988 - 2004
Basic Information
Gender
Male