タグ

ブックマーク / yusukebe.com (94)

  • 500点出す! - ゆーすけべー日記

    「Web Speed Hackathon 2022」という「非常に重たいWebアプリをチューニングして、いかに高速にするかを競う競技」があります。 リモート参加で11月1日から27日まで開催されています。 ここで言う「高速」とはCore Web Vitalsのスコアが高いことを言い、Lighthouseのスコアをベースにした500点満点の争いです。 ISUCONのフロントエンド版ですね。 以前にも同じ課題で「学生向け」と「社内(サイバーエージェント)向け」が行われたらしく、まだ500点を出した人はいません。 そこで僕は「満点を出したい」と思い、初日から、いやむしろフライングしていたからその前から頑張ってきました。 そして、先日(17日)、ついに500点満点を出しました! たぶん、レギュレーションはクリアしている、はずです(もし違反してたらすいません…)。 自動で行われる「Visual Re

    500点出す! - ゆーすけべー日記
  • How I/we got 2k stars - ゆーすけべー日記

    Honoという僕が作っているWebフレームワークのGitHubスター数が2,000に迫ってきた。これまで作ってきたOSSのソフトウェアでは最高で revealgo の221、次点で gh-markdown-preview の134だ。それが一気に2,000である。 もちろん、スターの数がソフトウェアの良し悪しを決めるものではない。 それに2,000はとりわけ多いわけではない。 でも、以前の自分には遥か彼方に見えていた数を獲得できたのは、とても嬉しいことだ。 去年12月から作り始めて9ヶ月間、552コミット。 今や使ってくれる人も増えた。 cdnjs のAPI Serverのバックエンドにも使われているし、 HonoをきっかけにGitHubスポンサーをしてくれている企業や人も現れている。 なにより、いろんなことを勉強させてもらった。 今回はHonoというプロダクトがどうやって2,000のスタ

    How I/we got 2k stars - ゆーすけべー日記
  • 君はPornhubを知っているか - ゆーすけべー日記

    Pornhubをご存知だろうか。 答えは当然Yesだろう。 ところがその当の実態について我々は理解しているだろうか。 WikipediaのPornhubページには興味深い事柄が書いてある。 YouTubeに次ぐ世界第2位の動画共有サイト 360度動画を提供しており、PlayStation VRで視聴できる 上下運動で発電できるリストバンドを発明した 宇宙空間でポルノを撮影すると発表した VPNHubというVPNサービスを開始した これらのいくつかを恥ずかしながら私は知らなかった。 この恥ずかしさがモチベーションとなり、私はPornhubのポルノ以外のことを調べた。 出てくるものはアダルトコンテンツばかりだったが、 以下の3つのページに出会うことができた。 Pornhub Insights :: Digging deep into the data Interview with a Por

    君はPornhubを知っているか - ゆーすけべー日記
  • ゆーすけべー日記

    去年の11月20日に発売した拙作「Webサービスのつくり方」の Amazon Kindle版 が出ましたー! 出版社である技術評論社さんに頑張ってもらいました次第。 お値段が紙のよりほんの少々安いくらいなのですが、Kindle読める端末で持ち歩けるのでよろしければどうぞ〜 と推したいところで、書いたからには推すのですが、実は紙の書籍はもちろん、このKindle版にも「アップデートすべき項目」がいくつかあがって来ました。というのもTwitter APIを使った数カ所のコードサンプルが現状では動かなくなっているのです... 出版社さんとは相談しつつ改訂や公式のサポートページでフォローしていきますが、まずはこちらの記事でざっくりと項目と修正案を紹介したいと思います。 「ぐだぐだ言ってないでコードを書けよ、ハゲ」で出てくるスクリプト 短いコードをサクっと書くことで検証も出来るよ〜という例でTwi

    ゆーすけべー日記
  • Webアプリエンジニアとしてのデザインとブリッジ - ゆーすけべー日記

    自分はまさに「アプリケーション」をつくることに特化したエンジニアもしくはクリエータだと思っているんだけど、 その件で考えていることを散文的に書いてみる。 最近では複数のメンバーやパートナーの方と仕事をすることが多いんだけど、その時に自分にとって有効として働くのはデザイン力である。デザインというのは広義の意味で使っていて、決して「Webページの見栄えをつくる」ようなデザインとはちと違う。Wikipediaの解説が的を射ているので紹介しよう。 デザインの語源はデッサン(dessin)と同じく、"計画を記号に表す"という意味のラテン語designareである。 つまりデザインとは、ある問題を解決するために思考・概念の組み立てを行い、それを様々な媒体に応じて表現することと解される。 デザイン - Wikipedia より一部引用。 例えば、みんなで話していて「これがやりたい!」とアイデアが生まれた

    Webアプリエンジニアとしてのデザインとブリッジ - ゆーすけべー日記
  • 地域コミュニティが熱い!?Kansai.pmに行ってきました #kansaipm - ゆーすけべー日記

    先日の土曜日2月23日、大阪駅のすぐ近くYahoo!さんの会議室にてKansai.pm第15回ミーティングが開催されました。僕はJPA=Japan Perl Associationさんの支援を受けてゲストスピーカーとして参加させていただいた次第です。大阪に行くのは高校の修学旅行で立ち寄った(確か...)以来。「大阪駅-梅田駅の地下とかがダンジョンで迷いやすい><」なんて情報を事前に仕入れていたのでビクビクしつつも行ってきました。その報告をしつつなんとなく地域コミュニティとしてのKansai.pmについての考察、感じた事をまとめます。 僕の発表 どんなトークをしようかなーと悩んでいたのですが、後ほど盛大にフューチャーするpapix君から Kansai.pm はスキル的に幅が広いのでなるべく全員に刺さるような発表を! みたいなことを言われ、テーマを決めました。題目はズバリ 「Webサービスのつ

    地域コミュニティが熱い!?Kansai.pmに行ってきました #kansaipm - ゆーすけべー日記
  • Webアプリにおけるキャッシュ。オレオレ事例 - ゆーすけべー日記

    Webアプリにおいて、アクセスやデータ量が多く/大きくなってくると、 バックエンドのパフォーマンスが低下しがちです。 MySQLなどのRDBMSにデータを置いている場合は適切に クエリーを改善する、インデックスを張る、といった策で解決する場合もありますが、 キャッシュを効果的に利用することでより高負荷に対応できる可能性があります。 また、外部APIへの問い合わせなど、どうしてもネットワークや他のリソースのレスポンスタイムに 引きずられる部分に関しては情報を手元にキャッシュしておくと何かとよいでしょう。 今回はWebアプリケーションのレイヤーで最近僕がどのようにキャッシュを使っているのか? の事例を紹介しつつまとめてみたいと思います。 キャッシュについてとその基 そもそもキャッシュとは、簡単にふわっと表現するならば、 「一時的に情報を手元の近い場所に置いておいて利用する手法、もしくはその一

    Webアプリにおけるキャッシュ。オレオレ事例 - ゆーすけべー日記
  • iPad mini を持って旅に出てる - ゆーすけべー日記

    実は先日27日木曜日。調子の悪いiPhone5を見てもらおうと渋谷の Apple Store に行ったら、ちょうどよく以前から欲しかったiPad miniが入荷していたので買ってしまった。iPad mini 16GB ブラックである。そして、たまたま昨日から鈍行列車を乗り継いで北海道まで行くという「青春18切符」な旅をしているので(実際は北海道&東日パスを使っている)そこでiPad miniを使い倒してみている。個人的にはタブレットほぼ初挑戦。未知のサイズであるこのデバイスについていくつか分かったことを報告したい。 Kindleアプリはメインアプリ? 最初から目をつけていたのはiPad miniを電子書籍のデバイスとして使うということ。 日上陸したAmazonKindleiPadアプリの展開もしているので、 Amazon上で購入したKindle対応書籍をiPadで閲覧することが出来

    iPad mini を持って旅に出てる - ゆーすけべー日記
  • daemontoolsで起動しているstarmanのログをfluentdで - ゆーすけべー日記

    fluentdが面白そうなんで、散らばっているAppサーバのログを集計してみたい。 アプリケーションは 基Perlで書かれてる Starmanで動かす .psgiで「enable "Plack::Middleware::AccessLog", format => "combined";」してる daemontoolsでデーモン化 という条件で、fluentdに付属のサンプル設定ファイルをほんの少しいじる。 tailして標準出力に出すだけだけど、いい感じです。 <source> type tail path /service/bokete_web/log/main/current format /^@[0-9a-z]+ (?<host>[^ ]*) [^ ]* (?<user>[^ ]*) \[(?<time>[^\]]*)\] "(?<method>\S+)(?: +(?<path>[

    daemontoolsで起動しているstarmanのログをfluentdで - ゆーすけべー日記
  • Yokohama.pm #9 でラーメンの話をして来た! - ゆーすけべー日記

    先ほど終了した Yokohama.pm #9 。行って来た&5分間の発表をしてきました。 今までの Yokohama.pm はあまりにも Yokohama 要素が少ないので、 みんなPerl の話をしている中、僕一人だけ横浜周辺のラーメンのトークをしました。 Perl の話を期待していた方ごめんなさい>< だけど みんなお腹空いちゃう感じでよかったのではないでしょうか! 発表スライドはこちらです。 横浜駅周辺のラーメン屋、オレオレBEST5を主に収録しております。 以上!あ、運営の方々お疲れさまでした。楽しかったです。

    Yokohama.pm #9 でラーメンの話をして来た! - ゆーすけべー日記
  • Markdownの文章を書くときに使えるMacソフト2つ - ゆーすけべー日記

    今僕は大抵の文章をMarkdown記法で書いています。 Markdownの心地よさは以前この日記に書いた通りです。 Markdownは編集時もレンダリング後も見た目があまり変わらず、プレーンテキストでありながら構造をもたらしてくれます。 Markdownで文章を書こう! - ゆーすけべー日記 「何用の」文章を書くかは人それぞれだと思いますが、 僕の場合はメルマガとこの日記(Blog)の記事というこの2つ向けの文章をメインで書きます。Markdownはプレーンテキストの状態でも構造が見やすいので、emacsなど僕にとって慣れてるエディタを使えばよいのですが、ある程度Markdown記法をサポートして色づけやプレビューなどをしてくれるエディタを使うとはかどります。後ほど解説する理由通りメルマガとBlog、それぞれエディタを分けて使っているので、その2つのMacソフトを紹介します。 DAY ON

    Markdownの文章を書くときに使えるMacソフト2つ - ゆーすけべー日記
  • PocketIOのイカ娘語echoサンプル - ゆーすけべー日記

    SocketIOのサーバ側Perl実装のPocketIO。 Hachioji.pmが中心となって開発しているYairc(仮)でも使われているんで、 気になって触ってます。 実用的に使うにはPlackのMiddlewareとかAppを活用して他のWeb Application Frameworkのアプリと同居させるといいのかなぁーと なんとなく妄想してみる。そこで、Plack::App::URLMapのmountメソッドでPocketIOのHandlerとMojoliciousアプリのパスを分けて、簡単なイカ娘語変換のechoサンプルをつくってみる!といってもMojoliciousアプリの部分ってほとんど無いけど! app.psgiはこんな感じっす。 use Mojo::Server::PSGI; use File::Spec; use File::Basename; use lib Fil

    PocketIOのイカ娘語echoサンプル - ゆーすけべー日記
  • 実装までにする7つの企画作業 - ゆーすけべー日記

    メルマガ「ゆーすけべーラジオ」にてWebサービス/アプリをつくるにあたっての僕なりのエッセイを連載中です。先週は実装前に行う企画作業についてまとめてみたのですが、評判がいいので、折角ですしBlogで公開させていただきます。特に複数名でのものづくりに参考にしてみてください! 何度か述べている通り、Webサービスにおいて「何を」つくるかは最も重要なことであり、いくら崇高な技術を持っていても「何を」つくるかによって、その技術が生きるか死ぬかが決まってきます。何をつくるかをしっかり決めることにより、実際に番用のコードを書く実装の段階にも確信が持てますし、リリースした際のフィードバックも活きてくるでしょう。世の中でよく使われているサービスやアプリを見るとアイデアに富んだ今まで無かったと言われるような「何」がしっかりとしたものが多いと思います。 こうしたサービスの企画をつくるに当たっては各自の流儀に

    実装までにする7つの企画作業 - ゆーすけべー日記
  • 名古屋城行った - ゆーすけべー日記

    名古屋に城を見に行った。写真をたくさん撮ったんだけどiPhone4でも結構イケるね。 城に行く前にモーニングをいただいた。普通のテーブルとゲーム機テーブルがあって迷わずゲーム機の方に座る。 ホットドックの中に入ってるキャベツがすごい炒めてあって旨かった。 コーヒーは飲みやすい。 名古屋城に入場するとすかさず待ち受けていた人たちからグッズをもらった。 ホッカイロ、ステッカー、ポケットティッシュ。 ちなみに思いのほか城周辺が片付いている的な意味で奇麗なのが驚いた。 城。シャチホコが見える。 梅が咲いていて奇麗だった。そういえば今年の河津桜の開花がものすごく遅れていてようやく今頃満開らしい。 梅を見たら桜を見たくなった。 帰りは浜松で餃子をった。野菜しか入ってないんじゃねって感じで旨いんだけど、するともはや餃子じゃないんじゃないか。 おまけ。名古屋城で見つけたチンコ。

    名古屋城行った - ゆーすけべー日記
    hisaichi5518
    hisaichi5518 2012/03/11
    チンコ…。
  • CSS Frameworkを持つ - ゆーすけべー日記

    例えば、Webサービスフロントエンドのコードを書き始める時にまず何をするでしょうか? デザインスケッチや画像を元にHTMLCSSを記述していくことになると思います。 少なくとも僕はそうですね。 理論的にはHTMLだけでもWebサービスを作ることはもちろんできますが、 見た目を少しでも調整したいとなるとCSSが必要になります。 例えばCSSを使わないHTMLの場合、いくら単純なレイアウトだとしても、 デフォルトのリンクの色を変えたかったり、フォントを変更したかったり、 要素ごとの余白をどうにかしかったりと最低限の要望が出てきます。 こうした最低限のCSSに対するニーズは共通化して自分なりのCSS Frameworkとして持っておくとよいと思います。 近頃、一からCSSを記述しなくなったのもこうした考え方のおかげです。 今Web上で配布されて利用可能なCSS Framworkが非常に増えて

    CSS Frameworkを持つ - ゆーすけべー日記
  • 月10万稼ぐにはiPhoneアプリ開発が一番速かった - ゆーすけべー日記

    実は大学時代の同期であるgamellaが面白いエントリーを書いていました。 題名は「ニート革命再々考とWebだけで月10万円稼げる力」。 ニート革命、つまり職がないときにじゃーどうするの?という問題について、こんなことを書いていた。 ... 最近はもう考え方が結構変わっていて、 とりあえずWebで月10万円稼げる方法を何とか見つける!というのが直近の答えなのかなーと思う。 ... 僕なりの解釈だと、Webだけで10万円を稼げれば、 住む場所によってはレバレッジが効いて場所と時間に束縛されないんで自由な生活できるんじゃね?ってとこです。 すごい同意です。特に今だったら日円を稼いで東南アジアに住むなんてプランはありありだと思います。 また10万円という単位も一つの目標としてよい設定値だと思います。 さて、僕は、諸々の事情があって日に住んでいますが、 Webだけで10万以上稼ぐことはしていま

    月10万稼ぐにはiPhoneアプリ開発が一番速かった - ゆーすけべー日記
  • 月額980円のさくらVPSを個人用に使い倒す - ゆーすけべー日記

    Webサービスの運営用にVPSと呼ばれるバーチャル・プライベート・サーバを借りることは昨今よくあることだと思います。 VPSのサーバを借りればroot権限を持てることになるので、自由度が高いサーバ環境を構築することができます。 また、スペックによって価格が違っていて、低いスペックなものだと月額かなり低価格なものが存在します。 僕はその中でも月額980円のさくらVPSを借りていて、それを個人用に限って使っています。 これから紹介するような用途であれば980円でもかなりいけます。 ちなみに980円コースのスペックは2012年3月現在で以下のようなものです。 メモリ: 512MB HDD: 20GB CPU: 2Core(仮想) gitリモートレポジトリ 僕が現行で行っているWebサービスでもiPhoneアプリ開発でもバージョン管理は必要になってきて、 そのためのプライベートなレポジトリが欲しく

    月額980円のさくらVPSを個人用に使い倒す - ゆーすけべー日記
  • ゆーすけべー日記

    サキとは彼女の自宅近く、湘南台駅前のスーパーマーケットで待ち合わせをした。彼女は自転車で後から追いつくと言い、僕は大きなコインパーキングへ車を停めた。煙草を一吸ってからスーパーマーケットへ向かうと、ひっきりなしに主婦的な女性かおばあちゃんが入り口を出たり入ったりしていた。時刻は午後5時になる。時計から目を上げると、待たせちゃったわねと大して悪びれてない様子でサキが手ぶらでやってきた。 お礼に料理を作るとはいえ、サキの家には材が十分足りていないらしく、こうしてスーパーマーケットに寄ることになった。サキは野菜コーナーから精肉コーナーまで、まるで優秀なカーナビに導かれるように無駄なく点検していった。欲しい材があると、2秒間程度それらを凝視し、一度手に取ったじゃがいもやら豚肉やらを迷うことなく僕が持っているカゴに放り込んだ。最後にアルコール飲料が冷やされている棚の前へ行くと、私が飲むからとチ

    ゆーすけべー日記
  • PerlのWAFはMojolicious推しな件とそのノウハウ - ゆーすけべー日記

    Perlerな皆さん!WAFは何を使っていますかー!? 昨日行われたという「Perl Beginners #1」のレポートを漁っていると @hsksyuskさんのエントリにこう書かれていましたので僕もつい乗っかってみたくなりました。 PerlのWAFは何がいいの? @ytnobodyさんはKossy推し。 僕はAmon2推し。 ぼ、ぼ、ぼ、僕はMojolicious推し!!! ということでなぜ僕が今、Mojolicious推しなのかを探るためにその「いい点」と思っていること列挙してみました。 それと同時に悪い点も見えてきて、かつバッドノウハウもあるなーって感じなのでまとめてみます。 Mojoliciousのいい点 依存モジュールが無くポータブル ご存知の通りMojoliciousは標準で入っているモジュールに依存しているだけで、 残りは自前で実装しています。なので、 $ cpanm Moj

    PerlのWAFはMojolicious推しな件とそのノウハウ - ゆーすけべー日記
  • 無ければつくる - ゆーすけべー日記

    車輪の再発明 車輪の再発明という言葉があります。ある目的を果たすためのライブラリや先行事例があるにも関わらず、 同じことを叶えるためについつい自分で作ってしまう行為を指します。 例えば、SinatraというRubyの特徴的なWebアプリケーションフレームワークがありますが、 そのPerlバージョンを作ろうとすれば、 他にもDancerやMojolicious::Liteといった似たようなものが、 Perlのライブラリには存在していて「 でも、いいっか! 」と制作に入るのがまさに「車輪の再発明」な感じです。 車輪の再発明は一般的に非効率だと言われ推奨はされません。 ただ、僕は勉強のためならばよいと思ってSinatraライクなフレームワークを作ってたりもします。 既存の似たようなものを参考にできるため、学ぶことが多いです。 状況によっては再発明は効果的なこともあると思っています。 とはいえやは

    無ければつくる - ゆーすけべー日記