タグ

2017年11月16日のブックマーク (6件)

  • パフォーマンスに関する各種ブラウザAPI - 1000ch.net

    パフォーマンスに関する各種ブラウザAPI ◯◯ Timing APIはW3CのWeb Performance Working GroupのIlya Grigorikを中心に策定が進められている、ブラウザのパフォーマンスを計測するブラウザAPIである。 User Timing API: 任意のラベルを用いてプログラムの実行にかかったを取得する Navigation Timing API: ブラウザライフサイクルの発生した時間を取得する Resource Timing API: リソースのロードに際して発生した各種時間を取得する Frame Timing API: ブラウザフレームの内訳を取得する Server Timing API: サーバー処理の内訳を取得する High Resolution Time API: 高精度のタイムスタンプを提供する ブラウザのwindowオブジェクトにperf

    パフォーマンスに関する各種ブラウザAPI - 1000ch.net
  • なぜ dev.to がこんなにも速く、こんなにも自分にとって感動的なのか

    最初にいっておく。これは負け惜しみだ。 SPAとPWAの現状 自分は日Reactの勝手エヴァンジェリストみたいなことをやっていて、SPAの重めのコンテンツをよく作ってるからか、「お前らフロントエンドを物事をややこしくして、重いページを量産してウェブを劣化させてるじゃないか!」みたいな批判を、名指しでよく受ける。なんで僕にいうかわからないけど、React = SPA みたいなイメージでスケープゴートにされてるんだろう。それはまあいい。 自分の仕事でSPA技術を使うところは、ちゃんと必要性もあるし理由も説明できる。ただ、やはり近年の複雑化/重量化について思うところはあるので、逆に振って AMP/PWA という選択肢を持っておきたくて、正直言うと依頼されたR&Dの仕事でもあったんだけど、一通り覚えた。なんだけど、今のところ仕事で使うタイミングがない。 PWA技術仕事で使えなかった理由として

    なぜ dev.to がこんなにも速く、こんなにも自分にとって感動的なのか
  • flocssについてまとめてみた - Qiita

    最近flocssを触っているのでいいタイミングだと思い今回まとめてみました。 flocssとは cssの設計思想の一つで、OOCSS、SMACSS、BEMなどのコンセプトが取り入れられています。 cssでありがちなこと 基原則 flocssでは次のようなレイヤーで構成されます。 foundation ブラウザのデフォルトスタイルの初期化(Reset.cssやNormalize.cssなど)や、プロジェクトにおける基的なスタイルを定義をする場所。 layout header,footer,メインコンテンツなどのページを構成する大枠の部分を指定する場所。 基的にはページ内で唯一の存在になるのでIDを使用するのも可能だが、IDセレクタは高い詳細度を持つため、 接頭辞(l-◯◯など)をつけた命名規則を採用するか,[id="header"]のように属性セレクタを使用することが推奨されている。

    flocssについてまとめてみた - Qiita
  • 「爆速すぎて笑う」 表示速度が“異常な”Webサイト「dev.to」 その仕組みは

    「爆速すぎて笑う」「速すぎて逆に不安になるレベル」――「dev.to」という米国のWebサイトの表示速度が異常に速いと、ネット上で話題だ。なぜ速いのか、サイト創設者のベン・ハルパーンさんがサイト内の記事で説明している。 2016年にオープンしたdev.toは、プログラマーが情報を交換したり、議論したりできるコミュニティーサイト。トップページにはユーザーが投稿したブログ記事のタイトルやコメントが、SNSのタイムラインのように並んでいる。このトップページの表示にかかる時間、各記事をクリックしたときのページ遷移が“一瞬”なのだ。 なぜ速いのか。ハルパーンさんが17年2月に投稿したブログ記事によれば、米Fastlyが提供するCDN(Content Delivery Network)を活用している。CDNは世界中にキャッシュサーバを分散配置し、ユーザーごとに最も(ネットワーク的に)近いサーバにキャッ

    「爆速すぎて笑う」 表示速度が“異常な”Webサイト「dev.to」 その仕組みは
  • [CSS]さまざまなデザインのチェックボックス・ラジオボタンを美しく実装するスタイルシート -Pretty Checkbox

    チェックボックスやラジオボタンのスタイルを苦手にしている人も少なくないと思います。シンプルなHTMLにclassを加えるだけで、さまざまなデザインのチェックボックスとラジオボタンが実装できるスタイルシートを紹介します。 角を丸くしたり、カラーをつけたり、といったシンプルなものだけでなく、アニメーションを使ったものもclassを加えるだけで簡単に実装できます。

    [CSS]さまざまなデザインのチェックボックス・ラジオボタンを美しく実装するスタイルシート -Pretty Checkbox
  • Best Practices "In Conversation, There Are No Errors"の日本語訳です

    Best Practices "In Conversation, There Are No Errors"の日語訳です Written on Nov 5, 2017. Posted in actions on google 注: この日語訳は、翻訳時点での内容が反映されています。そのため、既に古い記載内容となっている可能性があります。必ず最新の情報を Actions on Google Document で確認してください。 GUIによるアプリでは、ユーザが何か期待していないことを行った時や、システムが予期せぬ状況になった時には、エラーメッセージをユーザに提示することが一般的です。しかし、会話型UIでは、エラーダイアログといったインタフェースはありません。全てが会話です。人間同士の会話でも、突然相手から「○○エラーです」とか提示されることは、あり得ません。その代わり、会話は継続されます