PageSpeed Insight API を使ってサイトのPerformanceを取得する。
やりたいこと(やりたかったこと)
PageSpeed Insight APIを使ってPerformanceを取得してリリースごとに劣化していないか確認したかった。
実際にAPIを叩いてみる。
curlのサンプルがあるのですぐに叩ける。1秒間に複数回のリクエストをする場合は API Key が必要になるけど、基本的にいらないと思う。
curl https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=https://mutaonet.hatenablog.com/
レスポンスの量が凄まじいので省略。
レスポンスの詳細は下記。curlを使わなくても簡単にリクエストできる。
Performanceの結果は response → lighthouseResult → audits の中にある。
auditの中身は以下。大量にある。
resource-summary
no-document-write
screenshot-thumbnails
uses-optimized-images
first-meaningful-paint
render-blocking-resources
server-response-time
diagnostics
uses-long-cache-ttl
font-display
largest-contentful-paint-element
network-requests
estimated-input-latency
legacy-javascript
speed-index
unused-javascript
timing-budget
user-timings
unminified-javascript
first-cpu-idle
network-server-latency
first-contentful-paint-3g
unused-css-rules
performance-budget
critical-request-chains
long-tasks
interactive
max-potential-fid
dom-size
uses-rel-preconnect
uses-responsive-images
uses-passive-event-listeners
uses-text-compression
network-rtt
total-blocking-time
first-contentful-paint
redirects
cumulative-layout-shift
uses-webp-images
largest-contentful-paint
main-thread-tasks
large-javascript-libraries
offscreen-images
efficient-animated-content
non-composited-animations
unminified-css
layout-shift-elements
mainthread-work-breakdown
bootup-time
final-screenshot
total-byte-weight
third-party-summary
duplicated-javascript
uses-rel-preload
metrics
この key の中にまた階層構造があり、一体何を見ればよくわからない。
ここまでやったところで疲れて頓挫してしまった。
あとAPI の responce time も長いので debug にも根気がいる。
少しずつ進めていきたい。
PythonでWebAPIを作成してHerokuにデプロイするまで
何やったの
タイトルの通りにPythonの勉強の一環としてFlaskFWを使ってWEBAPI(仮)を作りました。
Herokuにデプロイしてアプリケーションを実行するまで結構詰まったので備忘録的に書きます。
作ったもの
https://commic-lover.herokuapp.com/
楽天BooksAPIを単にwarpして自分が好きなタイトルの漫画だけをJSON形式で返してくれるというもの。
楽天BooksAPIのレスポンスが遅いのでHerokuのdynoが休眠状態にあるかどうかにかかわらず遅い。
本当はAPIの実行結果をDBに蓄積していくまでやりたかったけどとりあえず目的は果たせた。
というかエラーページすら作っていないし、今月分の新刊情報しか持ってこれていないので作り込みが必要。
FlaskでAPI作成
これはqiitaの記事にも散々あるし公式のdocを眺めていれば作れるので割愛。
一つ気をつけたいのがHerokuでサブディレクトリをデプロイするときはめんどくさいので全部ルートディレクトリに作成した方が簡単。
サブディレクトリを作成したい人はこちらの stack overflowの記事を参照。
私はHerokuCLIを使わずにGUI上で全て完結させたかったのでやらなかった。
Herokuにデプロイ
Procfile
Procfileをルートディレクトに作成する。
https://devcenter.heroku.com/articles/python-gunicorn
Pythonの場合はgunicornを使うことが多いというか他の選択肢がdocになかったので従った。
web: gunicorn app:app
中身は至ってシンプル。ここで --chdir オプションでサブディレクトリに移動できたりもするらしい（未検証）。
requirement.txt
次に requirements.txtの作成。
pip freeze > requirements.txt
venvとか使っていないとpipで入れたモジュールが全て出力されてしまってPython触り立ての時は混乱した。
デプロイ
今回はGUIからやる。お手軽デプロイで時間短縮。
右上「 New」ボタンから「Create app」を選択。
好きなアプリケーション名を入力。Herokuの場合URLになる部分。
GitHubにPush済みなので connect to GitHub を選択。
あとはデプロイしたいブランチ等を選択。
Enable Automatic Deploys を ONにしておくとGitHubにpushされる度にビルドとデプロイをしてくれるのでONにすると便利。
あとは、Buildを待つだけでデプロイ完了です。
https://{アプリケーション名}.herokuapp.com/
LinuC Level1 102 合格体験記
LinuC Level1 102 取得しました。
これでLinuC level1 を取得したことになります。
勉強期間
1ヶ月ほど、101を受験したことによって慣れたのでこのくらいの期間で取得できたんだと思う。
勉強自体は平日1h休日2hくらいで見積もっている。もちろん仕事の事情だったりでさぼったりした日もあったので正味2週間ちょいと言う感じ
勉強方法はあずき本とping-tでほとんどping-t頼りだった。
やったのは主にコマ問、最強問題集の方は模試をずっとやっているだけ。
いくら模試をやってもレベル40(MAX)にはならなかった。このコンボって何で加算されているかわからない。
テストを受けてみて
102は入力問題は多いと聞いてコマンド問題ばかりやっていたけど大して出題されなかった。
入力問題全て落としても合格はできるんじゃないかなと思う。
そしてping-tほど難しい入力問題は出なかった。
選択式問題はping-tでやったこともないものがたくさん出てきた。
あずき本ベースで実際にLinux環境で色々といじってみた方がいいと思う。
難易度的には101の方が断然難しい、というか暗記量が少ない。
次の目標
もちろんLinuC level2を狙う予定。
その前にPython3エンジニア認定基礎試験に浮気したくなってきている。
いずれにせよなにかしらの資格の取得を狙っているので景気付けに大好きなヘンドリックスジンを買いました。
Amazon Linux Extras
Amazon Linux Extras
Q:Amazon Linux Extras とは何ですか? Extras は、安定したオペレーティングシステムで新しいバージョンのアプリケーションソフトウェアを利用可能にする Amazon Linux 2 のメカニズムで、2023 年 6 月 30 日までサポートされます。Extras は、OS の安定性を確保しつつ、最新のソフトウェアを利用できるようにするうえで役立ちます。例えば、5 年間サポートされる安定したオペレーティングシステムに MariaDB の新しいバージョンをインストールすることができます。Extras の例には、Ansible 2.4.2、memcached 1.5、nginx 1.12、Postgresql 9.6、MariaDB 10.2、Go 1.9、Redis 4.0、R 3.4、Rust 1.22.1 などがあります。
引用元: https://aws.amazon.com/jp/amazon-linux-2/faqs/#Amazon_Linux_Extras
ということらしい。OSに合わせて安定稼働するミドルウェアなどなどをyumで入れるらしい。
なぜ調べた？
EC2インスタンスを立ててnginxを入れて色々とごにゃごにゃしようかなと思ったときに以下のエラー文にあったから。
$ sudo yum install nginx 読み込んだプラグイン:extras_suggestions, langpacks, priorities, update-motd パッケージ nginx は利用できません。 エラー: 何もしません nginx is available in Amazon Linux Extra topic "nginx1" To use, run # sudo amazon-linux-extras install nginx1 Learn more at https://aws.amazon.com/amazon-linux-2/faqs/#Amazon_Linux_Extras
特にバージョンに固執していないので今回はよかったけど、レガシーなシステムをAWSに移行するときとかにハマりそうな予感がしている。
もしかしたらAmazon Linux Extraを無視してforce install みたいなことができるかもしれないけど今回は調べてない。
実際入れてみる
$ sudo amazon-linux-extras install nginx1
（省略）
完了しました!
0 ansible2 available \
[ =2.4.2 =2.4.6 =2.8 =stable ]
2 httpd_modules available [ =1.0 =stable ]
3 memcached1.5 available \
[ =1.5.1 =1.5.16 =1.5.17 ]
5 postgresql9.6 available \
[ =9.6.6 =9.6.8 =stable ]
6 postgresql10 available [ =10 =stable ]
8 redis4.0 available \
[ =4.0.5 =4.0.10 =stable ]
9 R3.4 available [ =3.4.3 =stable ]
10 rust1 available \
[ =1.22.1 =1.26.0 =1.26.1 =1.27.2 =1.31.0 =1.38.0
=stable ]
11 vim available [ =8.0 =stable ]
15 php7.2 available \
[ =7.2.0 =7.2.4 =7.2.5 =7.2.8 =7.2.11 =7.2.13 =7.2.14
=7.2.16 =7.2.17 =7.2.19 =7.2.21 =7.2.22 =7.2.23
=7.2.24 =7.2.26 =stable ]
17 lamp-mariadb10.2-php7.2 available \
[ =10.2.10_7.2.0 =10.2.10_7.2.4 =10.2.10_7.2.5
=10.2.10_7.2.8 =10.2.10_7.2.11 =10.2.10_7.2.13
=10.2.10_7.2.14 =10.2.10_7.2.16 =10.2.10_7.2.17
=10.2.10_7.2.19 =10.2.10_7.2.22 =10.2.10_7.2.23
=10.2.10_7.2.24 =stable ]
18 libreoffice available \
[ =5.0.6.2_15 =5.3.6.1 =stable ]
19 gimp available [ =2.8.22 ]
20 docker=latest enabled \
[ =17.12.1 =18.03.1 =18.06.1 =18.09.9 =stable ]
21 mate-desktop1.x available \
[ =1.19.0 =1.20.0 =stable ]
22 GraphicsMagick1.3 available \
[ =1.3.29 =1.3.32 =1.3.34 =stable ]
23 tomcat8.5 available \
[ =8.5.31 =8.5.32 =8.5.38 =8.5.40 =8.5.42 =8.5.50
=stable ]
24 epel available [ =7.11 =stable ]
25 testing available [ =1.0 =stable ]
26 ecs available [ =stable ]
27 corretto8 available \
[ =1.8.0_192 =1.8.0_202 =1.8.0_212 =1.8.0_222 =1.8.0_232
=1.8.0_242 =stable ]
28 firecracker available [ =0.11 =stable ]
29 golang1.11 available \
[ =1.11.3 =1.11.11 =1.11.13 =stable ]
30 squid4 available [ =4 =stable ]
31 php7.3 available \
[ =7.3.2 =7.3.3 =7.3.4 =7.3.6 =7.3.8 =7.3.9 =7.3.10
=7.3.11 =7.3.13 =stable ]
32 lustre2.10 available \
[ =2.10.5 =2.10.8 =stable ]
33 java-openjdk11 available [ =11 =stable ]
34 lynis available [ =stable ]
35 kernel-ng available [ =stable ]
36 BCC available [ =0.x =stable ]
37 mono available [ =5.x =stable ]
38 nginx1=latest enabled [ =stable ]
39 ruby2.6 available [ =2.6 =stable ]
40 mock available [ =stable ]
41 postgresql11 available [ =11 =stable ]
42 php7.4 available [ =stable ]
43 livepatch available [ =stable ]
44 python3.8 available [ =stable ]
45 haproxy2 available [ =stable ]
nginx-latest というのが enabled になっているのでinstallされた模様。
他の available になっているのはAmazon Linux Extrasで提供されているものということだろうか。
jdkがきになる
jdkはやはりAmazon corretが入るのだろうか。多分そうだと思う。
$ sudo amazon-linux-extras install java-openjdk11 (省略) 33 java-openjdk11=latest enabled [ =11 =stable ] 34 lynis available [ =stable ] 35 kernel-ng available [ =stable ] 36 BCC available [ =0.x =stable ] 37 mono available [ =5.x =stable ] 38 nginx1=latest enabled [ =stable ] $ java --version openjdk 11.0.7 2020-04-14 LTS OpenJDK Runtime Environment 18.9 (build 11.0.7+10-LTS) OpenJDK 64-Bit Server VM 18.9 (build 11.0.7+10-LTS, mixed mode, sharing)
え？違うの？
corretto8というのがあったので入れてみた。
sudo amazon-linux-extras install corretto8
(省略)
27 corretto8=latest enabled \
[ =1.8.0_192 =1.8.0_202 =1.8.0_212 =1.8.0_222 =1.8.0_232
=1.8.0_242 =stable ]
28 firecracker available [ =0.11 =stable ]
29 golang1.11 available \
[ =1.11.3 =1.11.11 =1.11.13 =stable ]
$ java -version
openjdk version "1.8.0_265"
OpenJDK Runtime Environment Corretto-8.265.01.1 (build 1.8.0_265-b01)
OpenJDK 64-Bit Server VM Corretto-8.265.01.1 (build 25.265-b01, mixed mode)
正解だったみたい。ただstableは 1.8系のよう。AWS lamdaのランタイムは11と聞いてたけどあれはcorettoじゃないのかな・・・？
ping-t
ping-tとは？
IT系の資格試験の勉強に役立つサイトで問題集を提供している。
CCNA/CCNP、LinuC、HTML5、OSS-DB etc..
資格試験にはかなり役立つサイトなので重宝している。
一部無料だけど有料のプレミアムコンテンツを購入しないと全部の問題集は使えない。
LinuC101 は無料だけど、LinuC102はプレミアムコンテンツ扱いだったので1ヶ月分だけ購入した。
最近なんか変わった
結構チープな作りをしていたが、最近新システムというのがでてきた。
今風？なデザインに刷新されている。
旧システムは金・銀・銅のメダルでスコアを管理していて、問題を3回連続で正答すると金メダルになる。
一度でも間違うと金から銅メダルへと降格する。
新システムでは以下のようにスコアを管理している。
詳しくは知らないけど、スタンプを集めるとレベルが上がっていく感じになっている。
コンボというのがよくわからない。同じ問題を何回かクリアするとスタンプがもらえる？
スコアの管理方法は旧システムの方が分かりやすくていい。
新システムで初めから試験勉強するときは苦手分野がわかりにくいと思う。
LinuC 102 の勉強をしている最中だけど、苦手なインターネットの基礎分野をこれだと取りこぼしていたと思う。
まったく違う話
LinuCのバウチャーをping-tで購入していたら何故かプレミアムコンテンツ1ヶ月分がプレゼントされてきた。
バウチャーの購入だけが条件じゃない気がする。もしかしたら抽選？
Jsoup（メモ）
- HTMLタグを削除したかった
- Jsoup使えばかなり楽にいけることが判明
package module;
import org.jsoup.Jsoup;
import java.io.IOException;
public class HtmlParser {
public static void main() throws IOException {
// http://example.com/
String html = "\n" +
"<!doctype html>\n" +
"<html>\n" +
"<head>\n" +
" <title>Example Domain</title>\n" +
"\n" +
" <meta charset=\"utf-8\" />\n" +
" <meta http-equiv=\"Content-type\" content=\"text/html; charset=utf-8\" />\n" +
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n" +
" <style type=\"text/css\">\n" +
" body {\n" +
" background-color: #f0f0f2;\n" +
" margin: 0;\n" +
" padding: 0;\n" +
" font-family: -apple-system, system-ui, BlinkMacSystemFont, \"Segoe UI\", \"Open Sans\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n" +
" \n" +
" }\n" +
" div {\n" +
" width: 600px;\n" +
" margin: 5em auto;\n" +
" padding: 2em;\n" +
" background-color: #fdfdff;\n" +
" border-radius: 0.5em;\n" +
" box-shadow: 2px 3px 7px 2px rgba(0,0,0,0.02);\n" +
" }\n" +
" a:link, a:visited {\n" +
" color: #38488f;\n" +
" text-decoration: none;\n" +
" }\n" +
" @media (max-width: 700px) {\n" +
" div {\n" +
" margin: 0 auto;\n" +
" width: auto;\n" +
" }\n" +
" }\n" +
" </style> \n" +
"</head>\n" +
"\n" +
"<body>\n" +
"<div>\n" +
" <h1>Example Domain</h1>\n" +
" <p>This domain is for use in illustrative examples in documents. You may use this\n" +
" domain in literature without prior coordination or asking for permission.</p>\n" +
" <p><a href=\"https://www.iana.org/domains/example\">More information...</a></p>\n" +
"</div>\n" +
"</body>\n" +
"</html>\n";
//System.out.println(html);
System.out.println(Jsoup.parse(html).text());
}
}
traceroute と tracepath
traceroute/traceroute6
traceroute と tracepath の違いがよくわからなかったのでメモ書き。
宛先アドレスまでの経路を確認できる。
なおtraceroute6はIPv6対応のコマンド。 -g オプションはない。
| オプション | 説明 |
|---|---|
| -n | 結果表示の形式をアドレスで表示。途中で到達したホスト名の名前解決をしないので表示が早くなる。 |
| -p | 使用するポート番号を指定 |
| -g | 使用するgatewayを指定 |
| -T | TCPを使用 |
| -I | ICMPを使用 |
traceroute -p 443 -n example.com
traceroute to example.com (93.184.216.34), 64 hops max, 52 byte packets
1 XXXXXXXXX 7.401 ms 3.710 ms 2.990 ms
2 153.153.224.244 9.576 ms 9.456 ms 12.821 ms
3 153.153.224.157 10.585 ms 10.823 ms 10.101 ms
4 118.23.39.65 11.832 ms 10.740 ms 14.740 ms
5 153.146.147.13 12.326 ms 10.515 ms 12.819 ms
6 122.1.245.185 15.555 ms
118.23.168.137 14.818 ms 11.836 ms
7 120.88.53.25 13.867 ms 16.458 ms
120.88.53.21 16.787 ms
8 129.250.3.34 17.236 ms 16.156 ms 17.477 ms
9 129.250.3.193 125.385 ms 127.117 ms
129.250.5.78 119.447 ms
10 129.250.4.107 124.336 ms
129.250.3.175 119.893 ms 124.003 ms
11 128.241.4.218 132.632 ms 142.837 ms
128.241.4.222 140.268 ms
12 152.195.85.133 125.230 ms 153.076 ms 121.937 ms
tracepath
宛先アドレスまでの経路と経路上のPathMTUを確認することができる。
| オプション | 説明 |
|---|---|
| -n | 結果表示の形式をアドレスで表示。途中で到達したホスト名の名前解決をしないので表示が早くなる。 |
| -b | ホスト名とIPアドレスの両方を表示 |
| -l | 初期パケットの長さを設定。 tracepathの場合は65535、tracepath6の場合は128000を設定 |
| -m | 最大ホップ数をmax_hopsに設定する。 |
| -p | ポートを指定する |
$ tracepath -n example.com 1?: [LOCALHOST] pmtu 9001 1: 172.31.16.1 0.200ms pmtu 1500 1: no reply 2: no reply 3: no reply 4: no reply 5: no reply
man コマンド一部抜粋
DESCRIPTION
It traces path to destination discovering MTU along this path. It uses UDP port port or some random port. It is similar to traceroute, only does not require superuser privileges and has no fancy options.
tracepath6 is good replacement for traceroute6 and classic example of application of Linux error queues. The situation with IPv4 is worse, because commercial IP routers do not return enough information in
ICMP error messages. Probably, it will change, when they will be updated. For now it uses Van Jacobson's trick, sweeping a range of UDP ports to maintain trace history.
tracerouteと違うのはスーパーユーザ権限を必要とせず、UDPportを使うというところ。あとは、MTUを確認できること。
