diff --git a/backend/templates/songs/index.html b/backend/templates/songs/index.html
index fa50c34..363e9b0 100644
--- a/backend/templates/songs/index.html
+++ b/backend/templates/songs/index.html
@@ -120,60 +120,77 @@ <h6 class="d-inline" ><%:author%></h6>
     import {Options, BooleanOption} from "{% static 'js/Options.js' %}"
     const canWakeLock = () => 'wakeLock' in navigator;
 
+    function debounce(callback, delay = 1000) {
+      var time;
+
+      return (...args) => {
+        clearTimeout(time);
+        time = setTimeout(() => {
+          callback(...args);
+        }, delay);
+      };
+    }
+
     let table = null
-    function createDatatable(paging) {
-        return $('#datatable').DataTable({
-        processing: true,
-        select: false,
-        paging: paging,
-        deferRender: true,
-        drawCallback: function () {
-            const selector = $(".raw[type='number']")
-            selector.inputSpinner({
-                decrementButton: "<i class=\"icon-minus\"></i>", // button text
-                incrementButton: "<i class=\"icon-plus\"></i>",
-                groupClass: "transposer",
-            });
-            selector.toggleClass("raw")
-        },
-        initComplete: function() {
-            document.getElementById("content").classList.remove("d-none");
-            document.getElementById("spinner").classList.add("d-none");
-        },
-        dom: 'rt<"mt-2 ms-1"p>',
-        columns: [
-            {
-                data: 'number',
-                visible: false,
-                searchable: true,
+    function createDatatable(paging, initialSearch) {
+        const options = {
+            processing: true,
+            select: false,
+            paging: paging,
+            deferRender: true,
+            drawCallback: function () {
+                const selector = $(".raw[type='number']")
+                selector.inputSpinner({
+                    decrementButton: "<i class=\"icon-minus\"></i>", // button text
+                    incrementButton: "<i class=\"icon-plus\"></i>",
+                    groupClass: "transposer",
+                });
+                selector.toggleClass("raw")
             },
-            {
-                data: 'text',
-                render: function ( data, type, row ) {
-                    {% if user.is_authenticated %}
-                    row["edit_url"] = baseEditUrl.replace("0", row.id)
-                    row["delete_url"] = baseDeleteUrl.replace("0", row.id)
-                    {% endif %}
-                    return $.render.song(row);
-                },
-                className: "accordion-item mt-1 ms-1 p-0",
-                searchable: true,
-            },
-            {
-                data: 'name',
-                visible: false,
-                searchable: true,
+            initComplete: function() {
+                document.getElementById("content").classList.remove("d-none");
+                document.getElementById("spinner").classList.add("d-none");
             },
-            {
-                data: 'author',
-                visible: false,
-                searchable: true,
+            dom: 'rt<"mt-2 ms-1"p>',
+            columns: [
+                {
+                    data: 'number',
+                    visible: false,
+                    searchable: true,
+                },
+                {
+                    data: 'text',
+                    render: function ( data, type, row ) {
+                        {% if user.is_authenticated %}
+                        row["edit_url"] = baseEditUrl.replace("0", row.id)
+                        row["delete_url"] = baseDeleteUrl.replace("0", row.id)
+                        {% endif %}
+                        return $.render.song(row)
+                    },
+                    className: "accordion-item mt-1 ms-1 p-0",
+                    searchable: true,
+                },
+                {
+                    data: 'name',
+                    visible: false,
+                    searchable: true,
+                },
+                {
+                    data: 'author',
+                    visible: false,
+                    searchable: true,
+                }
+            ],
+            data: JSON.parse("{{ songs|escapejs }}"),
+            pageLength: 50,
+            {% datatables_language %}
+        }
+        if (initialSearch.length !== 0) {
+            options["search"] = {
+                "search": initialSearch
             }
-        ],
-        data: JSON.parse("{{ songs|escapejs }}"),
-        pageLength: 50,
-        {% datatables_language %}
-    });
+        }
+        return $('#datatable').DataTable(options);
     }
     {% if user.is_authenticated %}
     const baseEditUrl = "{% url "chords:edit" pk="0" %}?next={{ request.path }}"
@@ -226,6 +243,14 @@ <h6 class="d-inline" ><%:author%></h6>
             $(".chord").show()
         }
     }
+    const search = debounce(
+        function ( val ) {
+            table.search(val);
+            table.draw(false);
+            console.log("searched")
+        }, 200
+    );
+
     const config = new Map([
             ["hide_chords", new BooleanOption(document.getElementById("hideChords"), hideChords, false)],
             ["prevent_sleep", new BooleanOption(document.getElementById("preventSleep"), function(value) {
@@ -237,7 +262,7 @@ <h6 class="d-inline" ><%:author%></h6>
                     document.getElementById("content").classList.add("d-none");
                     document.getElementById("spinner").classList.remove("d-none");
                 }
-                table = createDatatable(!value)
+                table = createDatatable(!value, document.getElementById("searchInput").value)
             }, false)],
         ])
     const options = new Options(config)
@@ -280,9 +305,8 @@ <h6 class="d-inline" ><%:author%></h6>
 
     });
 
-    document.getElementById("searchInput").addEventListener("input", function (event) {
-        table.search(event.target.value);
-        table.draw();
+    document.getElementById("searchInput").addEventListener("input", function(event) {
+        search(event.target.value)
     })
     </script>
 {% endblock %}
\ No newline at end of file