タグ

関連タグで絞り込む (141)

タグの絞り込みを解除

Javascriptに関するryownetのブックマーク (222)

  • 文字列の結合方法による速度差 - Qiita

    文字列の結合のさせ方によって速度が結構違う 多分これ常識なのかもしれませんが、測ってみてはじめてその速度差がわかったのでメモっときます。 下記コードにて計測 var cnt = 100000; var moji = ''; console.time("Case1"); for (var i = cnt - 1; i >= 0; i--) { moji = ''; moji += 'もじもじ'; moji += 'もじもじ'; moji += 'もじもじ'; moji += 'もじもじ'; moji += 'もじもじ'; }; console.timeEnd("Case1"); console.time("Case2"); for (var i = cnt - 1; i >= 0; i--) { moji = ''+ 'もじもじ'+ 'もじもじ'+ 'もじもじ'+ 'もじもじ'+ 'もじもじ

    文字列の結合方法による速度差 - Qiita
    ryownet
    ryownet 2014/11/13
    case2が最速。文字列は単純に+で並べるのが良い。手元でやってみたけどcase1,3はあんまり変わらなかった(ともに遅い)
  • Material UI

    Google's material design UI components built with React.

    ryownet
    ryownet 2014/11/09
    デザイン使いたいだけなのにReact動かすとかメンドイ
  • JSライブラリ/フレームワークの良い、悪いメモ - 素人がプログラミングを勉強していたブログ

    ※ただのメモで、未来志向なのであまり真に受けてはいけない。 良いっぽい React.js 早速い/コンポネント志向/APIの設計がいい。JSXと他のトランスパイラの組み合わせという問題はある Promise ネイティブに入った、誰もが使ってる TypeScript ES6時代でも存在意義のある言語。TypeScript互換のFacebook Flowの動向に注目 Backbone.js ModelとEventを使う/Viewは使わなくていい Lodash Underscore.jsをよくしたやつ Gulp Gruntより良いという意味で。browserifyまわりがうまく動かない問題があってnpm runのほうがいいという噂もあるがまあ良いに分類してもいい EventEmitter Custom EventはDOMにくっ付いてる感があるのでロジック志向の物にはEventEmitter使った

    JSライブラリ/フレームワークの良い、悪いメモ - 素人がプログラミングを勉強していたブログ
    ryownet
    ryownet 2014/11/06
    触らない間に終わっているライブラリもあるので怖くて触れない感あるが触らないとわからない
  • Webフロントエンドに従事するお前らはいい加減高頻度イベントとレイアウトとスタイリングの付き合い方を考えろ - Qiita

    もうなんかこの際マジで言わせていただくんですけど、知ってるか知らないか分かりませんが世の中にはすごい頻度で呼ばれうるDOMイベントって言うのがいくつかあるわけですよ 例えば scroll mousemove, touchmove devicemotion 辺りですよ。 で、高頻度で呼ばれるって言うことは必然的に処理量が増えるって分かりますよね?????while(1) {}じゃないとはいえUIスレッドに十分影響を与えうる頻度で呼ばれる訳です。分かりますよね???????? そうなると当然そのイベント内で重い処理を行えば人間が認識できるレベルでのレスポンス遅延が起きるっていうのはご理解できますよね? 重い処理っていうのはまぁ想像出来るとは思うんですが例えばよくあるのが DOMのレイアウトプロパティへのアクセス offsetTop、offsetLeft、offsetWidth、offsetHe

    Webフロントエンドに従事するお前らはいい加減高頻度イベントとレイアウトとスタイリングの付き合い方を考えろ - Qiita
    ryownet
    ryownet 2014/10/24
    画面描画の概念がないからクソコードになるよね。onEnterFrame的なのがあるとFPS意識するから重いのを気にするけど、JSは何が重いのかわからなくても動くしね
  • 昔ながらの「片手間に書くJavaScript」の限界 - mizchi's blog

    Javascriptを使うのをやめろ:Railsの時代遅れ云々についての結論 - Qiita この記事は、全体的に自分の業務以外の評価基準やトレンドを知らないんだなという感じで、わざわざ付き合うと精神的に消耗する感じがした。ただ、それが彼らの職でない以上、自分もこの結論に至るのは仕方ないと感じている部分はある。 真の問題は、自分がレガシーなJavaScriptを書いているという自覚がない人間が、ここ数年の技術トレンドから乖離したコードを書き続けることで他のエンジニアやエコシステムそのものに悪影響を及ぼしているケースが散見されている。一行書く毎にグローバル汚染するスクリプトを見せられてもメンテ出来んと言われても、はいそうですねとしか言えないし、そういう人に最近のライブラリを触らせると遅くなるというのは、画面全体を一つのMustacheテンプレートにしてBackbone.Modelのパラメー

    昔ながらの「片手間に書くJavaScript」の限界 - mizchi's blog
    ryownet
    ryownet 2014/06/30
    分かりやすくまとめるぜ。サーバエンジニアがjQueryで片手間に作るJSは、UX優先の場合は窓から投げ捨ててJSエキスパートをアサインしろってこった。必要なスキルを理解できてないPMの問題。
  • Epoch by Fastly

    Epoch A general purpose real-time charting library for building beautiful, smooth, and high performance visualizations. Download v0.5.2 Built for Developers Built with developers in mind, making it easy to extend and adapt charts to your particular domain.

    ryownet
    ryownet 2014/06/27
    d3とjqueryでリアルタイムのグラフ。バー、パイ、エリアなど。右から左に流れていくデータ可視化が必要ならありかと
  • JavaScriptフレームワークはもうこりごり | POSTD

    JavaScriptでフレームワークを書くのはもうやめましょう。 JavaScriptフレームワークというものは、あたかも避けられない死と税金のようなもの、絶対にぶちあたる避けられないものといわれています。こっそり聞いてみましょう、新しいウェブプロジェクトが始まるとき、一番初めに聞かれる質問は?十中八九は「どのJSフレームワーク使っているの?」でしょうね。昨今の業界においてJSフレームワークというものは当に根深く浸透しているのです。でも、だから必須だというものではないのです。実際、もう使うべきではないのです。 どうしてこういった結論に至ったのか、振り返ってみましょう。 AngularにBackbone、Ember・・・ ここのところ長い間、 ウェブプラットフォーム とはHTML+CSS+JS、と簡潔に技術用語の羅列でまとめられてしまっていましたが、そこにはもっとぴったり表す用語“大混乱”

    JavaScriptフレームワークはもうこりごり | POSTD
    ryownet
    ryownet 2014/06/19
    HTML Imports, Object.observe, Promises, そしてHTML Templatesといった新しいスタンダード推し
  • レンタルサーバーナレッジ

    Twitter CPIのTwitterアカウントでは、サイト、サーバー管理者のための重要なセキュリティ情報や、サイト運営者のためのヒント、お得なキャンペーン情報をお知らせしています。 Follow @cpiadjp Tweets by cpiadjp 掲載内容について、当社は情報の掲載には細心の注意を払っておりますが、完全性などについて保証を行うものではありませんので予めご了承ください。 掲載されている情報をご利用いただいた際に、損害が発生・誘発した場合や、情報自体の真偽性・合法性・道徳性・著作権の許諾等について問題が発生した場合などについて、当社は一切の責任を負いません。掲載されている情報を利用したサイト製作については、ご自身の責任において行ってください。

    レンタルサーバーナレッジ
  • Yeomanではじめる爆速webアプリ開発

    Web屋という仕事のこれから 〜Web動向からWeb屋に必要な技術を考えてみる〜 FutureSync Vol.5 で発表したスライドです。 タイトルは釣りです。前半はほぼネタです。 中身はJavaScriptで動作するデバイスは楽しいからみんなやってみたら? という内容です。

    Yeomanではじめる爆速webアプリ開発
  • PHP と JavaScript の噺

    2. わたしについて ● PHP歴 = 7年, エンジニア歴 = 6年 ● Rakuten, inc. なんと新卒4年目になる ● 最近のお仕事 ○ node.js でバックエンドなシステムづくり ■ BaaS Team, Web Sevice Platform Group ○ Java & Groovy でバックエンドなシステムづくり ○ http://webservice.rakuten.co.jp 楽天API 運用・開発・ 宣伝何でもやる課 ○ PHPはちょっと見るくらい ■ 一番最近やったPHP仕事は Symfony2.0 から 2.3 へのバージョンアップ

    PHP と JavaScript の噺
    ryownet
    ryownet 2014/03/26
    php.jsだってよ
  • Sidebar Transitions

    Slide in on top Reveal Push Slide along Reverse slide out Rotate pusher 3D rotate in 3D rotate out Scale down pusher Scale Up Scale & rotate pusher Open door Fall down Delayed 3D Rotate

    ryownet
    ryownet 2013/09/04
    普段は隠れてるサイドバーが出てくるUI。デバイス対応と同じ考え方をPCコンテンツでも。これはかっこいいよ
  • 最近のJavaScript開発まとめ

    こんにちは、中川です。 ここ1・2年ですが、私の担当するプロジェクトでは、 PHPよりもJavaScriptの開発が多い状態が続いております。 JSのプロジェクトを重ねるにつれ、開発環境も段々と整理されてきましたので、 一旦、最近のJS開発で利用しているライブラリやツールなどをまとめてみました。 フレームワーク ●Backbone.js http://backbonejs.org/ JavaScriptのMVCフレームワーク。 何も使わない(もしくは我流)よりは、これを使って欲しいと思えるフレームワークです。 利用者が多く日語情報も豊富にあるのと、フレームワーク自体が1500行程度と軽量なため、学習コストを低く抑えることができます。 ●AngularJS http://angularjs.org/ データバインディングを備えたフレームワーク。 高機能なテンプレートや、DIの仕組み、ルーテ

    最近のJavaScript開発まとめ
    ryownet
    ryownet 2013/07/17
    おいていかれるぅー
  • JavaScript イディオム集

    JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 (7/3追記: twitter等で教えていただいた内容を追加しました) +v (数値化) var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります(例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります)。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v

    ryownet
    ryownet 2013/07/05
    +vで数値化とか、ほぼ使わないけど冗長じゃなくなる書き方
  • フロントエンドのツール Yeoman を勘違いしていた

    Yeoman を勘違いしてスルーしてたところもあったので、 改めてこんなメリットがあるんだーみたいなところを共有しつつ、 必要性を感じられる人が使い始める機会になれればと思います。 僕もこれからちょいちょい使っていきたいです。Read less

    フロントエンドのツール Yeoman を勘違いしていた
    ryownet
    ryownet 2013/07/01
    各種足場を用意してくれるジェネレータツール
  • Web制作で面倒な作業を自動化するビルドツール、Grunt v0.4 入門

    Web制作で面倒な作業を自動化するビルドツール、Grunt v0.4 入門 2013-03-14 / 2014-03-12 Webサイトの表示速度を気にすると、CSSJavaScriptのminify、gzipCSS Sprite、画像の最適化などの面倒な作業が発生します。 Grunt.jsとは? Grunt.jsは、サーバーサイドJavaScriptのNode.jsを使用したCUIのビルドツールです。 タスクを設定しておき、それらを自動化します。 コマンドプロンプトやターミナルなど、いわゆる「黒い画面」を使います。 Grunt.jsの現在のバージョンは0.4.1です。 バージョンが0.3から0.4になったことで、大きく仕様が変わりました。 Grunt.js v0.4ではgrunt-cliをインストールしてプロジェクトごとにGruntやプラグインをインストールして使用します。 プラグイ

    Web制作で面倒な作業を自動化するビルドツール、Grunt v0.4 入門
    ryownet
    ryownet 2013/06/12
    何かメリットありそうな気もするが最初がめんどい
  • [JS]納品前の確認に最適、使用されていないCSSのセレクタを見つけ出すスクリプト -Helium

    ウェブサイトの多数のページ全体に渡り、スタイルシートで定義されたセレクタが使用されているかどうかチェックし、使われていないセレクタのレポートを生成するスクリプトを紹介します。 納品する際に、不要なセレクタを除去するのに役立ちますよ。 Helium -GitHub Heliumの準備 Heliumの使用方法 Heliumの準備 HeliumはjQueryなど他のスクリプトを必要せず動作し、URLのリストから全てのページをロードし、解析して、スタイルシートで見つけたセレクタが全ページで使用されているかどうかチェックし、レポートを作成します。 スクリプトは、開発環境で実行してください。 公開中のサイトで実行すると、ユーザーにもHeliumの動作が見えてしまいます。 Step 1: 外部ファイル テストするページの全てに、当スクリプトを外部ファイルとして記述します。 場所は、head内でも</bo

  • HTML5で Speed Test, Navigation Timing APIによる性能データ収集 - ぼちぼち日記

    今日は、HTML5 Advent Calendar 2011 9日目です。 何を書こうかネタに迷い、ひたすらHTML5のマイナーなAPIをあさっておりました。 FullScreen API/Page Visibility API も既に 登場してしまい、 @sada_h さんから Quota Management API はいかがとお奨めを受けましたがさすがに Quota管理だけでネタを展開するのは辛く、途方に暮れていました。 そんな折、ふと見かけたのが「Navigation Timing API」。マイナーだと思いますねぁ。今回このAPIの紹介とデモをさせていただきます。 Navigation Timing API 「いったい Navigation Timing API は何をするAPIか? 」単純です。 「ブラウザーがWebの画面を表示する時にどこにどれだけ時間がかかているか知るAPI

    HTML5で Speed Test, Navigation Timing APIによる性能データ収集 - ぼちぼち日記
    ryownet
    ryownet 2012/04/06
    window.performanceの詳しい内容
  • Navigation Timing (W3C Working Draft 26 October 2010)

    W3C Recommendation 17 December 2012 This version: http://www.w3.org/TR/2012/REC-navigation-timing-20121217/ Latest version: http://www.w3.org/TR/navigation-timing/ Previous version: http://www.w3.org/TR/2012/PR-navigation-timing-20120726/ Editor: Zhiheng Wang (Google Inc.) <zhihengw@google.com> Please refer to the errata for this document, which may include some normative corrections. See also tra

    Navigation Timing (W3C Working Draft 26 October 2010)
    ryownet
    ryownet 2012/04/06
    window.performanceでより詳細な画面表示にかかった時間を取得。これでボトルネックを洗い出すやり方をまとめたい
  • gruntで快適JS/CSSビルド生活

    programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / ※ この記事はgrunt version 0.2.x のもので、grunt 0.3 からはAPIが変更されています grunt というJS/CSSのビルドツールが便利だったので紹介します。(Mac/Linux) cowboy/grunt - GitHubこのgruntってのは、JS,CSSを全部まとめて繋げる、まとめてJS lintする、minifyする見たいのをタスクとして登録しておくと、それ実行すればちゃちゃっとやってくれちゃうやつです。さらにwatchっていう機能使えば、ファイルが更新されたらそのタスクをやってくれるみたいなのも。 似たモノで、MakeとかRakeとかCakeとかそういう

    gruntで快適JS/CSSビルド生活
    ryownet
    ryownet 2012/02/26
    CSSやJSを圧縮、結合、コンパイル、チェックほかいろいろできるnodeツールらしい
  • [JavaScript]\uXXXX形式にunicodeエスケープする関数 / LiosK-free Blog

    2007-12-22 カテゴリ: Client Side タグ: JavaScript Tips Unicode JSON さっきはPerlにはまるとか言っておきながら結局JavaScriptJavaScriptの文字列を、\uXXXXの形式のUnicodeEscapeSequenceにエスケープする関数を書きました。 JavaScriptの文字列をJSONとかでよく見かける、 \u672c\u65e5\u306f\u6674\u5929\u306a\u308a の形式の文字列に変換する関数です。ソースやサンプルは続きで。 ソース var unicodeEscape = function(str) { var code, pref = {1: '\\u000', 2: '\\u00', 3: '\\u0', 4: '\\u'}; return str.replace(/\W/g, fu

    ryownet
    ryownet 2012/02/22
    jsonで忘れがちなunicodeエスケープ