diff --git a/package.json b/package.json
index a172397..f567ec8 100644
--- a/package.json
+++ b/package.json
@@ -23,10 +23,9 @@
     "*.scss"
   ],
   "devDependencies": {
+    "@types/gl-matrix": "^2.4.5",
     "@typescript-eslint/eslint-plugin": "^3.10.1",
     "@typescript-eslint/parser": "^3.10.1",
-    "@types/gl-matrix": "^2.4.5",
-    "gl-matrix": "^3.3.0",
     "autoprefixer": "^9.8.6",
     "css-loader": "^3.5.2",
     "eslint": "^7.9.0",
@@ -34,6 +33,7 @@
     "eslint-plugin-import": "^2.22.0",
     "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-unused-imports": "^0.1.3",
+    "gl-matrix": "^3.3.0",
     "html-webpack-inline-source-plugin": "0.0.10",
     "html-webpack-plugin": "^3.2.0",
     "mini-css-extract-plugin": "^0.9.0",
diff --git a/src/scenes/rain/droplet.ts b/src/scenes/rain/droplet.ts
index 7f3c99f..0bea6d8 100644
--- a/src/scenes/rain/droplet.ts
+++ b/src/scenes/rain/droplet.ts
@@ -1,4 +1,4 @@
-import { vec2 } from 'gl-matrix';
+import { ReadonlyVec2, vec2 } from 'gl-matrix';
 import { DropletFactory, rgb } from 'sdf-2d';
 import { Random } from '../../helper/random';
 
@@ -24,7 +24,7 @@ export class DropletWrapper {
     );
   }
 
-  public animate(currentTime: number, viewAreaSize: vec2) {
+  public animate(currentTime: number, viewAreaSize: ReadonlyVec2) {
     const heightOffset = 100;
     vec2.set(
       this.drawable.from,