GitHub - nextapps-de/winbox: WinBox is a modern HTML5 window manager for the web: lightweight, outstanding performance, no dependencies, fully customizable, open source!You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Techniques to make a web app load fast, even on a feature phone
Techniques to make a web app load fast, even on a feature phone How we used code splitting, code inlining, and server-side rendering in PROXX. At Google I/O 2019 Mariko, Jake, and I shipped PROXX, a modern Minesweeper-clone for the web. Something that sets PROXX apart is the focus on accessibility (you can play it with a screenreader!) and the ability to run as well on a feature phone as on a high
How Web Content Can Affect Power Usage
Users spend a large proportion of their online time on mobile devices, and a significant fraction of the rest is users on untethered laptop computers. For both, battery life is critical. In this post, we’ll talk about factors that affect battery life, and how you, as a web developer, can make your pages more power efficient so that users can spend more time engaged with your content. What Draws Po
Imba 👐 Intuitive and powerful language for building web apps that fly
Imba.mount <nav#hero -> <a href='/guides'> "Get started" <a.github href=linkToGitHub> "GitHub"var Imba = require('imba'), _1 = Imba.createElement; Imba.mount((t0 = (t0=_1('nav')).setId('hero').setTemplate(function() { var $ = this.$, t0; return Imba.static([ ($[0] || _1('a',$,0,t0).setHref('/guides').setText("Get started")).end(), ($[1] || _1('a',$,1,t0).flag('github').setText("GitHub")).setHref(t
hapi.dev
Build powerful, scalable applications, with minimal overhead and full out-of-the-box functionality - your code, your way Originally developed to handle Walmart’s Black Friday scale, hapi continues to be the proven choice for enterprise-grade backend needs. "At Brave, developing web services with hapi allows us to focus on the many problems to be solved, not on the details of the tool being used. h
reg-suit
VISUAL REGRESSION TESTING SUIT reg-viz provides regression testing tools. Getting Started Compare Images reg-suit is inspired by snapshot testing. It compares the current images with the previous images, creates an HTML report for their differences. All you need is to give images to assert. Store Snapshot reg-suit automatically stores snapshot images to external cloud storage(e.g. AWS S3, GCS). Yo
addEventListener の第3引数が拡張されてるという話 - Qiita
Webアプリケーションのお話です。 イベントハンドラを登録する addEventListener メソッドの引数は以下の形で覚えている人が大半だと思う。 element.addEventListener('click', myClickHandler, useCapture); 参考記事 EventListenerOptions これまでの第3引数 useCapture は boolean 型をとり、イベントハンドラがキャプチャフェーズ or バブリングフェーズのどちらで処理されるかを制御するものだった。 この第3引数が Object 型も受け付けるようになり、現状、それぞれ boolean 型で once , passive , capture パラメータをとる。 once true でイベントハンドラが1度だけ処理される。 例えば Window の load イベントハンドラは通常1度
AUI - Documentation
AUI Documentation Components Design Patterns Upgrade guides Support Getting started FAQ Ask a question Version 9.11 Older versions Changelog Atlassian User Interface 9.11 AUI is a tailor-made frontend library for creating a user interface according to the Atlassian Design Guidelines. Component documentation AUI provides JavaScript, CSS and Soy templates (or markup patterns) for a range of ready-ma
フロントエンドチューニングの箇条殴り書き
普段気をつけてるよリスト "モバイルで、WebViewとブラウザのコンパチで、特にセオリー化されていないデザインモジュールのなか、装飾画像もふんだんに使うぞ系サービス開発" の文脈における、パフォーマンス確保のため気をつけてるよリスト。 よく、パフォーマンス「向上」とか「確保」とか申しますが、メンテナンスコストなどと天秤にかけて、「必要十分」のラインを狙うのが重要だと思う次第。 画像リソース 画像リソースを揃えるときのセオリ。圧縮率とか最適化とか細かいチューニングはあれど、大雑把に下記を守る。そしてImage Optim（or 相当の処理）。 JPEGはプログレッシブで画質60くらい（オレ目安） PNGは差し支えない範囲で色数をきちんと削る 50px未満のサムネイルは@2.0xなリソースにしない 案外、Androidあわせの@1.5xや@1.0xでも大丈夫なことすらある GIFアニメを入れ
スマートフォン対応でよく使うhtml、css、javascriptのまとめ
スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
Mobile Performance Manifesto
⚠️ Warning: this is an old article and may include information that’s out of date. ⚠️ Earlier this year I gave a talk (slides) outlining the latest and greatest in mobile performance, including a bit of my own unscientific research into carrier latency and bandwidth thanks to boomerang.js. I realized that interest in mobile performance has exploded recently, especially with Steve Souders announcin
Facebook 向けウェブサービスは IE6 に対応すべきか ( 2011年12月の Facebook のブラウザシェア ) - IT戦記
はじめに みなさん、お元気ですか＞＜リリースも終わって、一息ついたあまちゃんです！ ヽ(´ー｀)ノわー さて今日は、最近「お花サプライズ！」というサービスをリリースしたのですが、そのときにちょっと面白いデータを見つけたのでそのいきさつも含めて紹介したいと思います。 （今日のテーマはこの円グラフ） フェイスブック系のサービスはどのブラウザに対応すれば良い？ よく、ウェブサービスを開発するときの悩みとして「古いブラウザでのデザインをどのくらいケアするか？」というものがあります。 「お花サプライズ！」でも、割と短い期間で実装することを目標としていたり、本番の HTML を書いた経験があまりないメンバーが多くいたことで「IE6 や IE7 への対応が鬼門なんじゃないか？」という心配が常にありました。 そこでよぎる甘い誘惑 このご時世、 IE6 とか IE7 に特別対応する必要なんてないんじゃね？
YSlow for Mobile が出ていますね | gaspanik weblog
Webページを表示速度面で最適化するための改善点を調べてくれることで有名な米Yahoo!さんの「YSlow!」ですが、そのモバイルデバイス用ブックマークレット「YSlow for Mobile」が公開されています。 で、ものは試しで使ってみました。 ブックマークレットを保存して、YSlowを呼び出せばオッケイとりあえず、公開されているページにあるいずれかの方法でブックマークレットをモバイルデバイスに保存しましょう。あとは、チェックしたいページを開いて、保存したブックマークレットを呼び出すだけでオッケイです。 なんか変ですが、まだβ版ということで（笑）。ブラウザ版の拡張機能と同じくいくつかのプロファイルを選択できるようになっています。「Run Test」をクリックすればチェック開始。 すると、表示しているページをチェックして改善点を出してくれます。キャッシュを空にしても「0.0k」とかでてた
たったワンクリックであらゆるサイトのJavaScriptやCSSを圧縮＆最適化してくれる『zbugs』 | 100SHIKI
これはすんごく便利・・・。 zbugsを使えば、ワンクリックであらゆるサイトのCSSおよびJavaScriptを圧縮してくれるようだ。 もちろん何パーセント圧縮されたかとか、どのファイルがどれだけ小さくなったかといったことの詳細も教えてくれる。 さらに圧縮したファイル群をまとめてダウンロードすることも可能だ。 サイトをつくったあとに、さらなるスピードアップを図るのにいいだろう。インターフェースも素敵でシンプルなので一度試してみるといいですよ。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
rrweb.io | Open source web session replay library
GitHub - jadjoubran/webdash: 🔥 Orchestrate your web project with Webdash the customizable web dashboard
2018 年の Web 標準 / Web Standards 2018
そろそろ真面目に
Webフロントエンド開発をやる
開発上の様々な依存のつらみと FRESH! by AbemaTV の話