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.
Vue.jsを全く触ったことないところから始めて、SPAのWebサービスを2ヶ月でリリースできたのだけど、同僚から「ちょっと表示が遅いですね」と言われた。それまではとにかく機能を動かすのとソースコードの見通しを悪くしないようにというのだけ気にしてて、パフォーマンスをあまり気にしていなかった。 で、少し気になって試しにGoogleのPageSpeed Insightsで計測してみたところ、なんとモバイルで26点だった。PCの方でも52点。 これはマズイと思い、いろいろ試行錯誤してモバイル72点、PCは98点まで改善したので、以下したことをまとめておく。 Google Fontsの読み込みの最適化 まずはこれ。Google Fontsはカッコイイけど、公式にあるCSSでの読み込みをするとめちゃくちゃ表示を遅くしてしまう。 AMP にも対応!Google Fonts を preload で先読み
ご挨拶 こんにちは! 主にフロントエンド周りをやっているアベです。 前回Vueの記事を書き(真のフロントエンドエンジニアになるために、まずはNuxt.js + Firebaseを使って簡易メモ帳を作ってみた - LiBz Tech Blog)、次はReactを触ってみようかなと言っていたのですが、 今回もVueを使うことになりました... Vueを使うといっても簡単なものでたいしたことはしていません。 SVGを操作するのにVueが向いているということで、 それじゃあVueでSVG触ってみようとタイトルの通りLGTMの画像を制作できるツールを作ってみました。 なぜ作ったのか? 一応なぜこんなわけのわからないツールを作ったかを説明させていただきます。 LGTMとの出会い 前にいた会社ではGitHubをかろうじて使用していましたが、レビューをしたりされたりということはいっさいありませんでした。
Explore and experiment with JavaScript and TypeScript, visualise your ideas and get instant feedback as you type. Exploring JavaScript has never been easier. Live feedback as you type, with per-line results makes it super clear what your code is doing. With RunJS you have access to Node.js and Browser APIs, including full DOM access. This gives you a level of versatility that's not possible in a s
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました GraphQLはRESTfulに代わる、または補助する存在として注目を集めています。しかし、まだ出始めの技術だけに最適な設計手法が確立されていません。スキーマを作る作業する手作業、またはフレームワークを導入していることでしょう。 今回紹介するGraphQL Visual Editorはそんなスキーマの作成をWebブラウザ上で行い、さらにバックエンドまで作れるソフトウェアです。 GraphQL Visual Editorの使い方 設計画面です。ノードが並んでおり、それらを繋ぐことでスキーマを設計します。 追加、削除、変更できます。 例えばこれはGitHubのGraphQLのスキーマ。とても細かく定義されています。 スキーマを確認できます。 GraphQL Visual Editorは
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads 71 Ads API 11
textlintで過去のブログの文章をチェックしてみました。 https://textlint.github.io/ textlintのセットアップhttp://neos21.hatenablog.com/entry/2017/11/05/080000 セットアップはこちらのブログ記事を参考にさせてもらい、npm i --save-devでこのブログのプロジェクトにモジュールを追加しました。 textlintには、デフォルトでは1つもチェックルールが入っておらず、必要な物を自分で追加していくスタイルです。 textlint-rule-preset-ja-technical-writingという技術文書向けの複数のルールをまとめたルールプリセットがあって、それを使うと20個以上のチェックが一発でインストールできて便利でした。 package.jsonのdevDependenciesの部分を抜
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く