t32k t32k

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

rendr-examplesを眺めてみたメモ。

00. simple

基本的な構成。npm install & grunt serverでhttp://localhost:3030で起動する(以下のexampleも同様)。

01. config

00ではindex.jsに直接書かれていたdataAdapterConfigを/configディレクトリ内のファイルに分離。 NODE_ENVの値で本番/開発環境の設定ファイル切り替えを行う

I wanted to figure out the fastest way to load non-critical CSS so that the impact on initial page drawing is minimal.

TL;DR: Here's the solution I ended up with: https://github.com/filamentgroup/loadCSS/

For async JavaScript file requests, we have the async attribute to make this easy, but CSS file requests have no similar standard mechanism (at least, none that will still apply the CSS after loading - here are some async CSS loading conditions that do apply when CSS is inapplicable to media: https://gist.github.com/igrigorik/2935269#file-notes-md ).

Seems there are a couple ways to load and apply a CSS file in a non-blocking manner:

Published: Mon Mar 24 2014 01:37:14 GMT+0900 (JST)
Paths: http://t32k.me/static/blog/skelton.css
Generator: t32k/stylestats // GitHub

1

Metrics	Result
Stylesheets

Go Kyoto (Go勉強会そうだ京都、行こう)

About

実施概要

2014/3/15 (土) 14:00
http://www.zusaar.com/event/4367004

CROSS 2014 : CI/DevOps

Github, Pull Request

45 Useful JavaScript Tips, Tricks and Best Practices

By Saad Mousliki

御存知の通り、JavaScriptは数あるプログラミング言語のうちのひとつであり、モバイルのハイブリッドアプリ（PhoneGapやAppceleratorといった）や、サーバーサイド（NodeJSやWakanda）等の様々な所で実装されているWebの言語です。また、Webブラウザにalertを出すところから、ロボットを動かす(nodebotやnodruinoを使って)ところまで様々なシーンで使われる言語となりました。 JavaScriptをマスターし、パフォーマンスの良いコードを生み出す開発者は市場で最も求められています。

CSS3デザインレシピ

この記事はFrontrend Advent Calendar 2013 18日目への投稿です。

Webサイトの装飾を担当するCSSには様々な機能追加・改良が加えられ、レベル3(CSS3)となった今、かつて画像やFlashなどでしか表現できなかったようなことが、CSSのコードを書くだけで実現できるようになりました。

CSS3で実装されたプロパティやセレクタを使うと従来画像にしていたものが、CSSだけで表示できたり、デザインのためだけに必要だった無駄なHTML要素が減ったりして結果的に読み込み速度とメンテナンス性の向上に役立ちます。

ここではCSS3で表現されたデザインサンプルをご紹介します。

Extra! Extra!

16世紀から17世紀にかけてのイングランドの哲学者であるFrancis Baconは:

人間の知識と力は一致する、というのも、原因を知らなければ、結果を生み出すこともできないからだ。

という言葉を著書"ノヴム・オルガヌム"に残した。

私、斉藤祐也(@cssradar)はすでにご存じの方も多いかもしれないが、情報を収集しニュースを書くための学問であるジャーナリズムを専攻し、巡り巡って現在はフロントエンド開発者をしている。

	# 目次

	+ JavaScript オブジェクトと値の型