romgrk
I often feel like javascript code in general runs much slower than it could, simply because it’s not optimized properly. Here is a summary of common optimization techniques I’ve found useful. Note that the tradeoff for performance is often readability, so the question of when to go for performance versus readability is a question left to the reader. I’ll also note that talking about optimization n
業務でAWSを利用する時に知っておくべきポイント10選 - Qiita
2024年1月時点のAWSベストプラクティスに従って作成しました 好評でしたら続編も検討します 1. 環境ごとにアカウントを分離する 本番、検証、開発ごとにアカウントを分割しましょう ✕良くない例 ◎良い例 最初にアカウント分割しておかないと、後で分割するのはとても大変です アカウントを分割することで「検証と思って作業したら、実は本番だった」のような事故を減らすことができます コストがアカウント単位で集計されるため、環境ごとのコストを簡単に算出することができます AWS Organizationsを使用することで、各環境に応じた権限設定が簡単にでき、ガバナンスを強化することができます AWSアカウントはAWS Control TowerのAccount Factoryを使用することで、クレジットカード情報を都度入力することなく簡単にアカウントの払い出しが可能です また、AWS Contro
【TypeScript】超実践的テクニック集【Reactなし】 - Qiita
はじめに この記事はニジボックスQiita記事投稿リレーの2日目の記事です🌈 TypeScript（Reactなし）のフロントエンド実務現場で1年半ほど業務してきたうえで、頻繁に使うTypeScriptのテクニック（tipsレベルですが）をまとめていきます。タイトルはちょい盛りです。 手続き型でDOMを直接ゴリゴリいじくるイベント駆動のスタイルで、いわゆるモダンフロントな現場ではないという点、あらかじめご承知おきください。 1. 自分で定義した型に型ガードする 1-1. ユーザー定義型ガードについて TypeScriptではtypeof、instanceof、inなどの演算子を用いて変数を型ガードできますが、これらの演算子では自分で定義した型へは型ガードすることができません。 type Hoge = "hoge" | "fuga"; const attr = document.query
console.log(); しか使えなかった自分へ。。。 - Qiita
この記事について Webエンジニアになって早１年半。railsのデバッグをする時にはエディターのデバッガーでスマートにできていたが、javascriptになるといつもconsole.log();ばかりを使って原始的なデバッグをしていた。。。 そんな脳筋な過去の自分に教えてやるための記事です。 console.log({変数名}); 「いきなりconsole.log();の紹介かい！！！」って思われるかもしれませんが、この技を知ったときは「なんで知らんかったんや。。。」って思うくらい便利だったので最初に紹介します。 以下のようなHTMLがある場合 <form> <input type="text" value="名無しの権兵衛" id="name"> <input type="text" value="80歳" id="age"> <input type="text" value="バスケ"
開発体験を変える! Chrome DevTools Tips 7選 - Qiita
最近Chrome DevToolsについて調べていて発見した便利機能を紹介します。 誰もが使える最高便利な開発マシンChrome DevToolsを使いこなして開発体験を変えましょう！ 1. $0で選択中のDOM要素の取得 特定の要素に何かしたいという時には、要素のIDやclassを確認してConsoleでdocument.querySelector("#xxx")で取得するというのが一般的だと思います。実はそれはカーソル選択と$0で代替できます。 Classや、IDがついていない特定のDOMを取得したい時とかにも使えるので地味に便利です。 手順 カーソルで取得したい要素を選ぶ Consoleタブで$0を入力 最近知ったChrome DevToolsの便利機能① $0 での選択中のDOM要素取得 Elementsタブで選択状態のDOM要素は、Console上で $0 を入力することで取得で
あなたが知らないJavaScriptの便利すぎるショートハンド19選
日頃書いているJavaScriptをもっと短く書く方法を知っていますか？ 目からうろこ、すぐに使えるJavaScriptのショードハンドを紹介します。 JavaScriptを使うすべての開発者に向けて、私が長年かけて身につけたJavaScriptのショートハンド（短縮記法）を資料にしました。コードの違いが分かるように通常の記述方法も併記しました。 1．三項演算子 if-else文を1行に収めた短縮記法です。 通常const x = 20; let answer; if (x > 10) { answer = 'is greater'; } else { answer = 'is lesser'; } ショートハンドconst answer = x > 10 ? 'is greater' : 'is lesser'; 従来のif文を1行に収めることも可能です。 const big = x >
ウェブアプリをソースごとパクる業者に対する対策 - Qiita
こんにちは。みなさんもウェブアプリをリリースしたあとに同業者にソースごとパクられたことってありますよね。難読化しても難読化されたまま同業者のサーバで動くので困ったものです。そこで、私がとった解析しずらい対策をまとめてみたいと思います。 前提 多機能な画面をJavaScriptでゴリゴリ作ったのにもかかわらず、HTMLやCSS、JavaScriptファイル一式を自社サーバにまるごとコピーして、ライセンス表記だけ書き換えて使うような業者を罠にはめるということを想定しています。 当然通信をリバースエンジニアリングする人もいるので、自社サーバでは防げないという前提です。 HTMLにはauthorメタタグ よくあるMETAタグで権利者を明記します。これは権利の主張もそうですが、JavaScript自体に権利者が認定した権利者でなければ無限ループを起こすという処理のためにも使用します。逆に、権利者が我
CSSプロフェッショナルのためのTIPS - Qiita
CSS ProtipsというTIPS集があって、これ一応日本語訳が既にあるんだけど、露骨に機械翻訳で何言ってるのか全くわからないので全編日本語訳した。 あれ、あんまり変わってない気がしてきたぞ。 CSSの便利な小技・テクニックのまとめ Awesome CSSのプロフェッショナルになりたい人のためのTips集を紹介するよ。 CSS以外のAwesomeリストを探したいときは@sindresorhusをフォローしよう。 目次 テクニック サポート 翻訳 手伝いたい テクニック CSSリセット 異なるブラウザ間でスタイルの一貫性を保つには、CSSリセットが役に立つぞ。 NormalizeのようなCSSリセットのライブラリを使用するか、もっと簡単には以下のように書ける。
Electronアプリをプロダクトとして「正しく」リリースするために必要な3つのこと | 株式会社ヌーラボ(Nulab inc.)
Typetalkデスクトップアプリ 先日、弊社チャットサービスTypetalkのデスクトップアプリをリリースしました。おそらくTypetalk.appのパッケージを覗いてElectronの痕跡を見つけ出した方もいらっしゃると思いますが、その通りElectronをベースに実装しています。 ElectronはHTML、JavaScript、CSSなどWebの技術を使用してデスクトップアプリを開発できます。GitHub社のAtomエディタをはじめとして、今では非常に多くのアプリがElectronベースで公開されており、実装方法についても既に多くの記事が書かれています。 ただし、正式にアプリを公開する場合には、コードサイニングなどを行うなど、考慮が必要なポイントがいくつかあります。そこで本記事では正式にElectronアプリをWindows/Mac向けにリリースするにあたって必要だった3つのことを
そろそろ真面目に、HTMLで帳票を描く話をしようか - Qiita
帳票といえばPDFとして生成するのが一般的でしょうか? でも、2015年の今、あえてHTMLで描くのがホットです(個人的に)。ミリ単位で設定された高度な帳票も、CSSを駆使して簡単に作ることができます。業務システムでもモダンブラウザを選択することが増え、@pageなども積極的に使えるようになったこと、SPA(Single Page Application)の台頭、いろいろと条件が揃ってきました。 書いてたら結構長くなっちゃったので、さくっとコードだけ見たい方は、Paper CSSリポジトリをどうぞ。 はじめに HTML帳票のメリット 2015年現在、HTML帳票を選択する幾つかのメリットがあります。 ライブリロードで、リアルタイムなスタイル調整 バックエンドではなくフロントエンドで生成できる 前者は、gulpやGruntの普及で、CSSにしろHTMLにしろ、リアルタイムにプレビューできる環
vim入門記事では見かけないマイナーかもしれない機能 - Qiita
一般的なVIM入門記事などではあまり見かけない標準機能など、 その中でも人によっては便利かもしれないややマイナーな機能を紹介します。 インサートモード <C-@> または <C-a> 直前のインサートモードで入力した文字を再入力できる。 aと@では入力後の挙動が異なる <C-@>: そのままインサートモードを抜ける <C-a>: インサートモードのまま入力を続ける 例えばノーマルモードで5a<C-@>と入力すれば... 直前に入力した文字(例えば)が5回入力される。 ちなみに動きとしては<C-a>は<C-r>.でも代用できる。 <C-r><c-o>または<C-r><C-p> <C-r>や<C-r><C-r>とは異なり、.キーによる繰り返し処理ではキー入力のまま再現される。 例えば abcをヤンクする インサートモードにて<C-r><C-o>"で貼り付ける。abcが出力される。 defをヤン
Python+SSHな自動化・デプロイメントツールFabricを活用するTips
こんにちは。CTOの馬場です。 みんな大好きFabricのTipsです。 Welcome to Fabric! -- Fabric documentation よくデプロイツールとして紹介されますが、 自動化のためのPython+SSH+コマンド実行フレームワークとして柔軟に使えて超便利です。 基本的には 手元でのコマンド実行 SSHごしのリモートサーバでのコマンド実行 SSHごしのリモートサーバでsudoしてコマンド実行 ができるツールなのですが、使い方の例を紹介します。 間違いなどあればお近くのハートビーツ社員か @netmarkjp に教えていただけると嬉しいです。 Python 2.7.10 + Fabric 1.10.2 + Paramiko 1.15.2で動作確認しました。 複数のサーバに対して同じユーザ・パスワードでログインする ユーザ名やパスワードを一括指定できます。 鍵認
fluentd -> Elasticsearch 大量データ転送でトラブル | diaspora
概要 fluentd でサービスの情報を転送し、Kibana で分析したい これまでの過去データを一度に放り込みたい データの件数が合わない Kibana でエラーが発生する 各種設定を見直すことで対応可能 背景 長い長いミーティングに疲れ、集中力を擦り減らしたアナタは 無意識のうちにブラウザを起動していました。 去年まで勤めていた会社の同僚がシェアした記事が目に止まります。 「fluentd + Elasticsearch + Kibana で今どきのログ分析！」 感化されやすいアナタはおもむろに VM を立ち上げ環境を構築します。 Web サーバから吐き出されたログはオシャレでイイ感じにチャート化され、 満足したアナタは VM を落とし、再び仕事に戻りました。 しばらく経ったある日のこと、ふと気づきます。 「ログだけじゃなくて、ユーザ属性の分析にもコレ使えそう。」 毎度オレオレ管理ペー
初心者向け、「上手い」シェルスクリプトの書き方メモ - Qiita
ここ最近、沢山シェルスクリプトを書くようになりました。 元々あまりシェルスクリプトを書いたこと無かったので、色々と勉強しつつ書いてるのですが、 他のプログラミング言語とはちょっと違って独特なクセというか、発見の度におぉー！ってなることが沢山あって楽しいです。 そんなわけで、最近学んだり参考にした中で特に感動したシェルの上手い書き方をまとめてみます。 きっとまだ知らないこととかもっと上手くやる方法なんかが沢山見つかりそうなので、 もっといいやり方あるよ！って方はコメントください 何もしない : (コロン)コマンド シェルを書いていた時に非常に欲しかったコマンドがこれ！何もしない！ : というコマンド(？)を利用すると、何もせずに終了ステータス0(つまり正常終了)を返します。 これが様々な事に使える万能コマンドで、これによって面倒なエラー処理を簡潔にできたり、 入力や出力のリダイレクト元/先と
JavaScriptのデバッグ方法 – JSを嫌いにならないためのTips | POSTD
この記事のオリジナルは voxxed に投稿されたものです。 JavaScript関連の問題を抱えるチームをサポートする仕事を通じて、いくつか共通の問題点があることに気づきました。もしあなたもJavaScriptに対するイライラを感じているのであれば、この記事は何らかの助けになるかもしれません。おことわり：私がお教えするヒントはすでにご存知のものもあるとは思いますが、うまくいけば、多少なりとも有用な情報があるかもしれません。特にエンタープライズアプリケーションやCMSソリューションを構築する際に有効なヒントです。チームの誰もが話したがらないCMSのコードについてお話しします。いずれも必要に応じて採用できるものです。 debuggerステートメント 大半のブラウザでサポートされているにもかかわらず、JavaScriptを書く際に最も活用しきれていない機能の1つです。debuggerステートメ
[翻訳] android best practice - Qiita
githubで★を集めてるandroid best practiceが勉強になるなぁと感心しておりまして、 思い切って翻訳していいかどうか問い合わせてみると快諾いただけたので翻訳してみました。 (Eclipse + ADTの話もでてますがそのまま訳してます。) 原文 : https://github.com/futurice/android-best-practices (Qiitaに投稿するついでに本家のリポジトリにもプルリクしてくれって言われてるので少し待てばそちらでも見れると思います。) この場を借りて、@askaさん、添削ありがとうございましたm_ _m 大変助かりました。 Summary Gradleで推奨されるプロジェクト構成で開発しよう パスワードや注意を要するデータはgradle.propertiesに書こう 自分でHTTP Clientは作らず、VolleyやOkHttp
![[翻訳] android best practice - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/be9148e697f55ca56745d012b0e736d83a596059/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCJUU3JUJGJUJCJUU4JUE4JUIzJTVEJTIwYW5kcm9pZCUyMGJlc3QlMjBwcmFjdGljZSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9Mzk4YmMzMmFjNTE1OGFlZjdhYzg2NGNmNDhiYzE3ODU%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBrZ215c2hpbiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9ZjdkZWIyMWM3OWE5MDE5MTU2N2E2ZWNiMzRhNGIxZjc%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4gRE1NLmNvbQ%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%2523212121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3D21868507daf67e9d9934a86e13fff954)
第25回 cron周りのベストプラクティス（3） | gihyo.jp
（1）はこちら、（2）はこちらから。 App::RunCron （3）では、前回（2）に出てきたcron実行結果の通知処理やエラーハンドリングを統一的に行うことができる拙作のフレームワークApp::RunCronを紹介します。 App::RunCronとは？ cronにおけるログとエラーハンドリングの問題点 cronで実行したコマンドのエラー処理は悩ましいところです。パイプで出力を後続のコマンドに渡したところで、コマンドの成否自体は後続のコマンドからは知るすべはなく、出力結果から推測するしかありません。ログ処理とも共通することですが、コマンド終了コードがわからないまま、成功時も失敗時の別なく出力が流れてくることから、ログが埋もれてしまうというジレンマをcronは抱えています。 かといって、ジョブごとにエラー処理を書くのは、正しく書くのも難しく、書けたところで各ジョブ内に同じようなコードが
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
yokuさんにutf8→utf8mb4binのときに教えてもらった便利Tips
【脱sed】いい加減シェルスクリプトで文字列をsedで置換するなんてやめよう - Qiita
ふつうのWeb開発者のためのクエリチューニング
