diff --git a/packages/mask/src/index.js b/packages/mask/src/index.js
index 2769fc3b5..9686a0d67 100644
--- a/packages/mask/src/index.js
+++ b/packages/mask/src/index.js
@@ -40,7 +40,16 @@ export default function (Alpine) {
             }
 
             // Override x-model's initial value...
-            if (el._x_model) el._x_model.set(el.value)
+            if (el._x_model) {
+                // If the x-model value is the same, don't override it as that will trigger updates...
+                if (el._x_model.get() === el.value) return
+
+                // If the x-model value is `null` and the input value is an empty 
+                // string, don't override it as that will trigger updates...
+                if (el._x_model.get() === null && el.value === '') return
+
+                el._x_model.set(el.value)
+            }
         })
 
         const controller = new AbortController()
diff --git a/tests/cypress/integration/plugins/mask.spec.js b/tests/cypress/integration/plugins/mask.spec.js
index 1046e3e0b..20d26e5ea 100644
--- a/tests/cypress/integration/plugins/mask.spec.js
+++ b/tests/cypress/integration/plugins/mask.spec.js
@@ -89,6 +89,21 @@ test('x-mask with x-model with initial value',
     },
 )
 
+test('x-mask with x-model if initial value is null it should remain null',
+    [html`
+        <div x-data="{ value: null }">
+            <input x-mask="(999) 999-9999" x-model="value" id="1">
+            <input id="2" x-model="value">
+            <span id="3" x-text="value === null ? 'NULL' : value"></span>
+        </div>
+    `],
+    ({ get }) => {
+        get('#1').should(haveValue(''))
+        get('#2').should(haveValue(''))
+        get('#3').contains('NULL')
+    },
+)
+
 test('x-mask with a falsy input',
     [html`<input x-data x-mask="">`],
     ({ get }) => {