タグ

ブックマーク / havelog.aho.mu (9)

  • Polymer と Web Components の違い9選(もとい Polymer の便利機能)

    違い、または付加機能 色々な周辺事情で、勢力を広げつつある Polymer さん。(つい最近、それに加担したような気もする) 「どこまでが Web Components で、どこからが Polymer なのか」を理解するためにもPolymerの機能をメモる。Polymer は色々なことを便利にしてくれるライブラリであり、差分を言い出すとキリがないので主要なポイントだけ。 <template> が自動で Shadow DOM に放り込まれる Shadow DOM内の <link> をインラインの <style> に展開 repeat のサポート {{interpolate}} のサポート <element> のかわりを <polymer-element> としてサポート on-click とかイベントハンドラの宣言 this.$ による idが付加された要素のコレクション observe に

    Polymer と Web Components の違い9選(もとい Polymer の便利機能)
    ir_takt
    ir_takt 2015/05/29
    Polymerの知見がWeb Componentsの仕様にフィードバックされたりすんのかな
  • 2014年のWebパフォーマンスふりかえり - 来年以降の期待etc

    ひさびさにWebフロントエンドパフォーマンス系の話題をつらつらと書いてみます。例によってモバイル系開発者寄りの視点かもしれません。文中の参照リンク多め。 ファクタ まずはパフォーマンスに影響を与えるファクタについての所感。Webパフォーマンスにおけるイニシャライズとランタイム ::ハブろぐ で示した分類に基づきます。 イニシャライズ(いわゆるページロード) 4GやLTEが普及してもコンテンツの肥大化には追いついていない concat と CSS Sprites の呪いが解けない HTTP/2 の Streams and Multiplexing に期待 HTTP/2 の Server Push にも期待 画像周りだと <picture> 関連仕様も使いたい(srcsetだけならいける?) WebRTC とか WebSocket とかストリーミングとかは? (やや疎い、てかイニシャライズじゃ

    2014年のWebパフォーマンスふりかえり - 来年以降の期待etc
  • Reactive Programming in JavaScript - Frontrend Final Conference 資料

    Reactive Programming in JavaScript ( 今回のスライド: HTML版 ) このスライド自体が Bacon.js で書かれた ahomu/Talkie で作られています。Rx系のライブラリに興味を持たれた方は、ぜひコードのほうもご覧いただければ。 アジェンダ What is Reactive Programming ? Reactive in Frontend JavaScript FRP with Reactive Extensions Reactive Programming について紹介しました。今回も懲りずに新ネタでしゃべった次第。Reactive も Functional も若干こわいひとたちが生息しているイメージ(個人の感想です)があるので、遅延評価で飛んでくる斧だけがこわい :P ノイズ避け 率直な感想として、RP/FRP を学ぼうとすると情報

    Reactive Programming in JavaScript - Frontrend Final Conference 資料
  • AngularJS についての所感

    AgularJS に対する気持ち 所感といいつつ、主に自分がつらさとして感じていることを書く。所感シリーズとしては jQueryについての所感 も併せて読みたい。 この学習曲線の中でいうと、たぶん今の自分は Very Cool! の頂点から降りている最中くらいだと思う。そして、マサカリをふりかぶった諸兄にひとつだけ言いたいのは、共感脳を養った方がモテるということだ。 チキンハート的弁解: 以下はAngularJSに関するつらさを述べることに専念するために、美点を挙げていないだけであってAngularJSを全方位的に貶めたり、何かと比べて明確にクソだというような意図はない。 画像は AngularJS: The Best Parts · Anand Mani Sankar からの引用。X軸にある www.bennadel.com は AngularJS 大好きさん。 辛1. $scope が

    AngularJS についての所感
  • Concatだけでビルドを済ませてた例(Backbone.jsとAngularJS)

    Concatでどこまで戦えるのか @jxck_ browserify使ってるんだけどあんま意味ない感じになっててつらいんだよねーっていうのを昨日 @ahomu に話したら、concatで全然いけますよって言われたからさっき乗り換えた。 — Kazuhito Hokamura (@hokaccha) August 6, 2014 (^ω^) 全然いけますよ 依存管理をサボってconcat 以下、「依存管理に労力を割きたくない」という理由で依存管理を省略した場合に、concatだけで破綻無くビルドするためにやっていたパターンの紹介。いけますと言った手前はあるが、最終的には現場によってケースバイケースということで、どうかひとつご容赦願いたい。 Case 1: Backbone.js Backbone.jsの場合、extends に代表されるクラスベースのオブジェクト指向モデルに多少の制約が必要に

    Concatだけでビルドを済ませてた例(Backbone.jsとAngularJS)
  • Componentによるフロントエンドのパッケージ管理

    直近で、新規案件に関わることになりそうなので、ライブラリ選定やタスクランナー、そして今回の依存管理のようにベーシックな話が続いてます。次第に、具体的な実装やコード設計のポストが多くなる・・・はず。 今回はVue.jsでも触れましたが、改めてcomponent - modular javascript frameworkについて。 概要 Componentはパッケージマネージャー兼、依存解決込みのビルドツールです。クライアントサイドについて、JSのパッケージマネージャーやビルダーは既にありますが、Componentは HTML/CSS/JSをセットにして扱うことができます。 npmでいうpackage.jsonと同様に、component.jsonという定義ファイルによって、パッケージの依存関係やリポジトリなどの各種情報を示します。 component/component コア部分のリポジト

    Componentによるフロントエンドのパッケージ管理
  • 俺流BackboneラーメンとPhalanxのはなし

    前置き この記事は Frontrend Advent Calendar 2013 の7日目です。 意見表明を避けてたジャンルだけど、俺流Backbone.jsとの付き合い方と、それを反映したライブラリについて書いてみる。大半が夏前に書かれていたけど、イマイチで放置してた系を掘り起こした! 職場近くに俺流塩らーめんというお店があって、そこの熟成塩ラーメン(¥680)が、スガキヤのラーメン(¥280)に近い味してる気がする。¥400余分に払っても価値がある。 巷ではdata bindingsだとかMV*の在り方に関心が集まっている昨今、マイペースにAOP風(記述言語がないので実装はmixin...)とか、Viewの領域管理の表現に腐心していた。 今の時点ではこれがベストとは思っておらず、つまるところ Marionette.js あたりを上手に使うことに注力すれば良さそうというのが結論だ。そこに

    俺流BackboneラーメンとPhalanxのはなし
    ir_takt
    ir_takt 2014/03/20
    PhalanxというMarionette的ラッパーを作るに至ったモチベーションと設計思想について。BackboneからMarionetteへ移行する前に読むとスムーズに移行できそう
  • Backboneの小ネタなパターン3つ (Backbone Advent Calendar 2012 21th day)

    Backbone.js Advent Calendar 2012の21日目でございます。おもむろに小ネタなパターンを、3つほど簡単に紹介してみる次第。 renderとpresenterの分離パターン これは Backbone.js Tips and Tricks を参考にしています。実践してみたところ、なにかと具合が良くてお気に入りのパターンです。 Backbone.View.extend({ tmpl: 'path/to/tmpl', initialize: function() { this.model = new SomeModel(); this.model.fetch({ success: this.render }); }, presenter: function() { var data = this.model.toJSON(); // data manipulation

    Backboneの小ネタなパターン3つ (Backbone Advent Calendar 2012 21th day)
  • Angularそっちのけで、Vue.jsについて所感

    Vue.js 軽量でパワフルなデータバインディングMVVM, vue.jsで遊んでみた - mizchi's blog を読んで触発されたので、自分も外見的に良いなと思ったポイントだけ書き留めてみます。さすがに実戦投入できていないので、そのあたりの精度は悪しからず。 サンプルコードの雰囲気 サンプルコードとか自分でちょっと触ってみたときの感触からは、以下のポイントが気に入りました。data-bidingsとかは前提として便利です。はい。 覚え切れそうな分量のAPI Class: Vue - vue.js 脳みそちっちゃいので助かります。それに尽きる。 プロパティによる宣言っぽさ Angularだとイベントハンドラ類を書くにも、$scopeに都度ハンドラを仕込んでいくのがあまり好きでないです。工夫で回避できそうですが、与えられたスタートが下記のような状態であることには変わりません。 angu

    Angularそっちのけで、Vue.jsについて所感
  • 1