Magento 2 Knockout Js Customer Name update issue after changing customer name

Question

I am having strange issue. In header, along with Welcome message i am showing Customer full name.

For that i am using knockout.js concept.

<?php if($block->customerLoggedIn()): ?>
<li class="customer-welcome">
    <span class="customer-name"
          role="link"
          tabindex="0"
          data-mage-init='{"dropdown":{}}'
          data-toggle="dropdown"
          data-trigger-keypress-button="true"
          data-bind="scope: 'customer'">
        <span data-bind="text: customer().fullname"></span>
        <button type="button"
                class="action switch"
                tabindex="-1"
                data-action="customer-menu-toggle">
            <span><?php echo $block->escapeHtml(__('Change')) ?></span>
        </button>
    </span>
    <script type="text/x-magento-init">
    {
        "*": {
            "Magento_Ui/js/core/app": {
                "components": {
                    "customer": {
                        "component": "Magento_Customer/js/model/customer"
                    }
                }
            }
        }
    }
    </script>

using above code displaying customer full name in header when customer logged in. For Ex: welcome Peter Parkar

When we change the customer name from account information section like below screenshot it doesn't update the customer name in header. If we logut and re-login then only it shows customer's updated name in header.

If we update the customer name it doesn't immediately reflect customer name in header.

What could be the issue? How can i resolve it? is there any way knockout.js can check for the updated details?

any help would be appreciated.