Web Components を本番投入する（2018年春）
2018.02.16Web Components を本番投入する（2018年春）とあるプロジェクトの技術監修をして、大まかに Web Components + Payment Request API な構成で進めてみたのでその話を思い出しながら書く。ちなみに FRESH! ではないです。 決済基盤をサービスで使うための SDKPayment Request API でお察しの通り、新たな決済基盤のプロジェクトで、それを使うための SDK を読み込んでボタンを配置すれば決済できる…みたいなものを作った。Payment Request API は、対応している環境ではそれで、対応していない環境では旧来の通り決済代行業者が用意しているフォーム付きページへ遷移させるという形でビジネスサイドへ提案した。 技術面に関しても、FRESH! で導入済みだったこともあり、いざとなればサポートできるという意味
JavaScriptで起こるメモリリークのパターン
2017.02.17JavaScriptで起こるメモリリークのパターン2014年1月25日に Frontrend in Fukuoka というイベントが開催された（もう3年前か…）。その時に Browser Computing Structure というタイトルで、ブラウザの仕組みやらスクリプト処理について発表している。 たまたま当時の資料を掘り起こす機会があったので、メモリリークのサンプルを直したついでにリークする JavaScript のパターンについて書き起こしてみる。サンプルは 1000ch/memory-leak に公開してあり、手順通り操作するとメモリリークを再現できるようになっている。 GCで回収されないオブジェクトJavaScript はランタイム上で動的にメモリを確保する GC（ガベージコレクション）を採用しているので、JavaScript の書き手がメモリの確保・開放を
画像の最適化をCLIだけで行うgrunt-imageを作った | 1000ch.net
GUI要らずを目指して Webにおける画像については以前記事にしましたが、 そのフローをより良くするべく最近gruntのモジュールを作ったのでその話を。 前置き 私は弊社サービスのパフォーマンス改善を業務としてしています。 何がボトルネックになっているかは各プロジェクトでまちまちですが、 共通しているのが 「とにかく画像が多い」 というところ。 どのサービスもペイロードサイズの80%程を画像が占めているんですね。 画像の最適化を忘れるだけで（例えば）100KBとか平気で増えるので、 これではCSSやJavaScriptのファイルサイズを減らしても本末転倒です。 （もちろんCSSもJavaScriptも結合と圧縮は非常に重要です。） 各種最適化ツール GUIだと以下の3つが有名で優秀です。 ImageAlpha - フリーソフト。24bitのPNGの8bitコンバートを行う。256色~2色ま
Zepto.js v1.0がリリースされました | 1000ch.net
2013/03/05 Zepto.js v1.0がリリースされました v1.0rcが11ヶ月間も続いていたのですが、 ようやくRelease Candidateではなくなり正式リリースとなったようです。 今回はZeptoについて振り返ってみました。 http://zeptojs.com/ https://github.com/madrobby/zepto おさらい 今更かとは思いますが、初めての方におさらいしますと、 Zepto.jsとはjQueryとAPIほぼ互換性があるモダンブラウザ向け軽量ライブラリです。 jQueryはIE対応とか$.AnimationとかDeferredとかあるけど その辺りを除いて実装してあるようなイメージ。現状、iOSやSafariにはIE対応とか必要ない訳で、 これ使うとファイルサイズ落とせますねっていうライブラリです。 ビルドについて ra
Grunt ver0.5に向けてのロードマップ | 1000ch.net
2013/03/07 Grunt ver0.5に向けてのロードマップ Roadmap - gruntjs/grunt/wiki 先日Grunt0.4がstableになりましたが、早速0.5に向けてのロードマップが発表されていますね。 意識してないけど、アップデートの追っかけブログみたいになっているな…。 Pythonのハンズオンも消化したので後日書こうと思っています。 ロードマップもちょくちょく変わるとは思いますが、軽めになぞってみる。 タスクは全てイベントとして実行される（ようになる） 複数タスク間のデータを繋ぎ合わせて使うことが出来らしい。 CoffeeScriptのコンパイル結果をそのままUglifyでMinifyしたり。 こんなイメージらしい。 // load a set of tasks to be run in parallel grunt.registerTas
Gruntの概要と導入手順とメリット | 1000ch.net
2012/12/08 Gruntとは grunt: a task-based command line build tool for JavaScript projects もはや説明不要の可能性もありますが、 gruntがgrunt-cliへの移行(?)をしたこともあり、まとめてみました。 コマンドラインで使用するビルドタスクのツールです。 js(ほぼjson)の設定ファイル上に、concatやminifyといったようなタスクを定義し、 コマンドラインから実行します。言葉だけだとイメージ湧きにくいと思いますので、 使ってもらうのが一番と言い張って導入手順の説明に入ります。 npmからgrunt-cliをインストールする （nodeとnpmはインストール済み・・・よね？） npm install -g grunt-cli これで核となるCLIのインストールは完了です。 ターミ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
