diff --git a/WebComponent.mjs b/WebComponent.mjs
index 7791f81..e0edc0f 100644
--- a/WebComponent.mjs
+++ b/WebComponent.mjs
@@ -23,10 +23,9 @@ export class WebComponent extends HTMLElement {
   attributeChangedCallback(property, previousValue, currentValue) {
     if (previousValue !== currentValue) {
       this[property] = currentValue;
+      this.onChanges({ property, previousValue, currentValue });
       this.render();
     }
-
-    this.onChanges({ property, previousValue, currentValue });
   }
 
   render() {
diff --git a/demo/index.html b/demo/index.html
index 07855ea..a6f715f 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -16,6 +16,10 @@
       setTimeout(() => {
         helloWorld.setAttribute("emotion", "excited");
       }, 2500);
+
+      helloWorld.addEventListener("click", () => {
+        helloWorld.setAttribute("name", "Clicked");
+      });
     </script>
   </body>
 </html>