Kotaro Hirayama khirayama

Jade FTW

こんにちは。今回は現実逃避を兼ねて Jade の素晴らしさをお伝えしたいと思います。

Jade とは何か

[Jade][0] は JST (JavaScript Templates) の一つであり、HTML を書くための[軽量マークアップ言語][1] である [Haml][2] に影響を受けた JavaScript テンプレートエンジンでもあります。

THIS GIST WAS MOVED TO TERMSTANDARD/COLORS REPOSITORY.

PLEASE ASK YOUR QUESTIONS OR ADD ANY SUGGESTIONS AS A REPOSITORY ISSUES OR PULL REQUESTS INSTEAD!

Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

Incremental DOM

Introducing Incremental DOM — Google Developers — Medium

Reactやvirtual-dom、Glimmer(Ember)などVirtual DOMの実装は色々あるが、これらのVirtual DOM実装には2つの問題がある

既存のテンプレート言語を利用していない(しにくい)
モバイルでのパフォーマンス、特にメモリに関しては大きすぎる

これらを解決するためにIncremental DOMと言うものを作っている(WIP)

flux-utils

facebook/flux ~~2.0.3~~2.1.0で追加されたflux/utilsについて

see also 2015-08-17のJS: redux 1.0.0、flux-utils、Firefox 40 - JSer.info

はてなブックマーク検索を作りながらFlux Utilsについて学ぶ | Web Scratchにもっと具体的な解説を書きました

	fizz = function f() {
	fizz = function () {
	fizz = function () {
	fizz = f
	return "Fizz"
	}
	}
	}

	buzz = function f() {

	var React = require('React/addons'),
	assert = require('assert');

	var Hello = React.createClass({
	render: function () {
	return React.DOM.p(null, 'hello');
	}
	});

	var jsdom = require('jsdom');