Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Hogan.js
Search
sayrer
February 01, 2012
Technology
2
1.2k
Hogan.js
Twitter Open Source Summit
January, 31, 2012
sayrer
February 01, 2012
Tweet
Share
Other Decks in Technology
See All in Technology
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
kkuv
1
340
CI/CD/IaC 久々に0から環境を作ったらこうなりました
kaz29
1
190
GitHub Copilot の概要
tomokusaba
1
140
MySQL5.6から8.4へ 戦いの記録
kyoshidaxx
1
270
WordPressから ヘッドレスCMSへ! Storyblokへの移行プロセス
nyata
0
200
OpenHands🤲にContributeしてみた
kotauchisunsun
1
480
AWS Summit Japan 2025 Community Stage - App workflow automation by AWS Step Functions
matsuihidetoshi
1
300
フィンテック養成勉強会#54
finengine
0
180
怖くない!はじめてのClaude Code
shinya337
0
200
生まれ変わった AWS Security Hub (Preview) を紹介 #reInforce_osaka / reInforce New Security Hub
masahirokawahara
0
280
AWS テクニカルサポートとエンドカスタマーの中間地点から見えるより良いサポートの活用方法
kazzpapa3
2
570
AWS Organizations 新機能!マルチパーティ承認の紹介
yhana
1
180
Featured
See All Featured
It's Worth the Effort
3n
185
28k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Stop Working from a Prison Cell
hatefulcrawdad
270
20k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
124
52k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.2k
For a Future-Friendly Web
brad_frost
179
9.8k
Rebuilding a faster, lazier Slack
samanthasiow
82
9.1k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Transcript
Hogan.js Twitter Open Source Summit January 31, 2012
@sayrer
Agenda
What is Mustache? {{#showform}} <form> <label>Label</label> {{{some_markup}}} <label class="checkbox"> <input
type="checkbox"> {{#i18n}}Check me out{{/i18n}} </label> <button class="{{class}}">Submit</button> </form> {{/showform}}
Why Mustache? •Similar to HTML, easy to edit •Mock data
as JSON files •Programmers not required
Designer
Language Support •Mustache.rb •Mustache.java •Mustache.js...
Problems •Performance •Runtime compilation •Forked
Choices •Work on Mustache.js •Dust.js •Handlebars.js •or...
Hogan.js •Compile on the server •Parser API •Performance
At Runtime var s = "some {{example}} text"; var template
= Hogan.compile(s); template.render({example: "foo"}); "some foo text"
Compiled var s = "some {{example}} text"; var template =
Hogan.compile(s); function(c,p,i){ var _ = this; _.b(i=i||""); _.b("some "); _.b(_.v(_.f("example",c,p,0))); _.b(" text"); return _.fl(); } "some foo text"
IE7 Performance
with iPhone 5
with Firefox 3.6
with Chrome 17
Uses at Twitter •Tweet embedding •Bootstrap build process •and soon,
Twitter.com
twitter.github.com/hogan.js Find us online: twitter.com/sayrer twitter.com/fat github.com/twitter/hogan.js Thanks!