静的ウェブサイト（ブログ）にpartytownを入れた
このブログはHugoで生成した静的webサイトである。 静的ページなので当然ながら読み込みは早い。Github Pagesで配布しているのでGithubのコンテンツキャッシュも効いている。 また一応アクセス解析のためにGoogle Analyticsを入れていて、大してアクセス数があるわけではないがモチベーションにつながっている。 ただしせっかく静的ページで読み込みを早くしているのにGoogle Analyticsのためにページロードの時間が割かれることにちょっと釈然としないものを感じていた。 GA一つでそこまで遅くなるわけではないけれど、頑張ってチューニングしたのにサードパーティスクリプトに律速されるのはなんとなく面白くない。 そこでpartytownを導入することにした。 https://partytown.builder.io/ partytownというのはDOM操作をするJavaS
Kea vs setState, Redux, Mobx, Dva, JumpState, Apollo, etc.
Kea is the name of the latest state management library for React that you have never heard of. It’s also the name of the smartest parrot in the world. Much like kea the parrot, kea the library doesn’t invent anything new. Instead it manipulates existing tools to get results in the shortest time possible. Kea the library is an abstraction over Redux, Redux-Saga and Reselect. It provides a framework
JS Girlsの作り方 (2014年度版) - Qiita
Frontrend Advent Calendar 2014の15日目の記事です。 近年NYLONを始めとするファッション雑誌でit girlと呼ばれるキーワードを目にします。NYLON JAPANではit girlを募集していたりします。しかし実際のところ何をもってit girlと呼ぶのか定義は難しいです。ここではitをもう少し具体的にJavaScriptのデキる女 JavaScript Girlとして、it girlになるための第一歩紹介します。JavaScript Girlsは俗に、JS Girlsと呼ばれ、今ではLINE スタンプになるほどの人気です。it girl憧れる女子のためのJS Girl入門方法を紹介します。 必要なもの 必要なものはすくない。 Macintosh インターネット 本 Macintosh パソコンじゃないですMacです。Mac OS X以降、Unixのパワ
ReactRubyをリリースした。
先日、React をテンプレートとして使えるRubyライブラリの ReactRuby をリリースした。 このブログは自作のブログエンジンで動いていて、気が向くたびに作りなおしている。何か使いたい技術やライブラリがあって試してみたいというとき、ブログエンジンというのは結構良い題材だと思っていて、実際今までもNode.jsを使ったりAngularJSを使ったりしてきた。 今回はFacebook製のコンポーネントフレームワークであるReactを使って、フロントエンドを作成しようと思い立った。Reactを選んだ理由として、Angularだとサーバーサイドでビューを生成できないので不満に思っていたことが挙げられる。 今まで、コンテンツページに関してはHAMLを使ってサーバサイドで生成していて、Angularのテンプレートキャッシュを使って読み込んでいたのだが、これだとフロントサイドでビュー生成してい
AngularJSでチェックボックスとモデルを紐付ける
AngularJSを使ったフォームでチェックボックスを使いたいとする。 このとき単に真偽値を取りたいのであればそのままモデルを設定すれば、checkboxの値（true/false）をモデルに紐付けることが出来る。 <input type="checkbox" ng-model="model" /> しかし真偽値以外の値をモデルに設定したい場合もある。 その場合にはngTrue, ngFalseディレクティブを使う。 <input type="checkbox" ng-model="model" ng-true="OK" ng-false="Fail" /> 上記の例だとチェックが入っていればモデルの値は"OK"に、入ってなければ"Fail"にそれぞれ設定される。 ただし、これらの紐付けはモデルに対して行われる。つまり、モデルの変更がチェックボックス側に伝達されるわけではない。これはHTM
AngularJS で外部javascriptを遅延読み込み
新しいブログエンジンでもコメントシステムはDisqusを使っている。 Disqusは記事ごとにコメント欄を生成し埋め込んでくれる優れたサービスなのだが、実装方法としてはjavascriptをブログ内で読み込んで指定のタグにロードしたDOM要素を展開するという仕組みである。 Angular.jsはng-includeなどの仕組みで、HTMLテンプレートを動的に読み込みができ、HTMLをパーツとして使いまわすことができる。 しかし、このテンプレートを読み込む際にscriptタグが含まれていた場合はセキュリティのためか、scriptタグが無視されてしまう。 そのためDisqusのように外部スクリプトを埋め込んでDOM要素を生成するようなサービスとは相性が悪い。 しかし、皆考えることは同じようで、ハックを公開してくれた人がいたので参考にさせていただいた。 使い方は簡単でngLoadModuleとい
AngularJS で外部javascriptを遅延読み込み // フリーランチなど無い - There ain't no such thing as a free lunch
新しいブログエンジンでもコメントシステムはDisqusを使っている。 Disqusは記事ごとにコメント欄を生成し埋め込んでくれる優れたサービスなのだが、実装方法としてはjavascriptをブログ内で読み込んで指定のタグにロードしたDOM要素を展開するという仕組みである。 Angular.jsはng-includeなどの仕組みで、HTMLテンプレートを動的に読み込みができ、HTMLをパーツとして使いまわすことができる。 しかし、このテンプレートを読み込む際にscriptタグが含まれていた場合はセキュリティのためか、scriptタグが無視されてしまう。 そのためDisqusのように外部スクリプトを埋め込んでDOM要素を生成するようなサービスとは相性が悪い。 しかし、皆考えることは同じようで、ハックを公開してくれた人がいたので参考にさせていただいた。 使い方は簡単でngLoadModuleとい
JSONとJSONPの違い
Twitter APIで取得していたコメントが消えてしまった。Twitter検索で引っかかるのは7日間だけである。これでは少し寂しいのでツイートの取得にTopsyを利用してみた。Topsyはツイッター等の発言をベースにした検索エンジンで、公開されたAPIから特定のサイトについてのツイートを抽出して取得するといったことが出来る。 それでTopsyのAPIをjQueryの機能で取得してみようとしたのだがjsonを取得しようとするとリクエストは200 OKを返すのにデータが取得出来ない。jQueryが原因かと思って色々調べてみたのだが違うようだ。原因はスクリプトの実行元と異なるドメインのデータをxmlHttpRequestでは取得出来ないかららしい。何故このようにしているかというとクロスサイトスクリプティングを防止するためのようだ。しかしこの制限にも抜け道がある。それがJSONPである。 JSO
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://twitter.com/azu_re/status/1634356593981816832
GitHub - lxsmnsyc/awesome-islands: All about Islands Architecture and Partial Hydration
Kea
throw new SubmissionError() causing Uncaught (in promise) error. · Issue #2269 · redux-form/redux-form
Remove unhandled promise rejection code. · Issue #72 · zloirock/core-js
Reactつかってみた
Twitterでコメント2
Twitterでコメント
SafariのLocationエンコードについて