Where Backend UI Component Forms Get their Data

In a typical adminhtml UI Form Component, each individual form element has a corresponding view model object. For text input fields, these view models come from the constructor function returned by the Magento_Ui/js/form/element/abstract RequireJS module.

The view model’s value property, an Knockout observable object, contains the field’s value.

This value property is set with the uiElement’s links feature.

#File: vendor/magento/module-ui/view/base/web/js/form/element/abstract.js
defaults: {
    /* ... */
    links: {
        value: '${ $.provider }:${ $.dataScope }'
    }            
}

The links default will set observable values on an object at the time of instantiation by pulling items from the uiRegistry. The above configuration sets the value property. The key it uses to pull values from the uiRegistry is created by the ES6 Template Literal String ${ $.provider }:${ $.dataScope }. The .provider property comes from UI Component XML configuration

<item name="js_config" xsi:type="array">
    <item name="provider" xsi:type="string">cms_page_form.page_form_data_source</item>
    <item name="deps" xsi:type="string">cms_page_form.page_form_data_source</item>
</item>

The child view models in a Magento_Ui/js/core/app application will (seems to?) inherit this provider value thanks to code in the Magento_Ui/js/core/renderer/layout.js module. The dataScope value also comes fromUI Component XML configuration

<item name="dataScope" xsi:type="string">title</item>

In out above example, the links.value` key has a value of

cms_page_form.page_form_data_source:data.title

The Magento_Ui/js/core/renderer/layout module manipulates the dataScope value on the view mode object to include parent values,

This is why dataScope expands to data.title instead of just title

#File: vendor/magento/module-ui/view/base/web/js/core/renderer/layout.js
function getDataScope(parent, node) {
    var dataScope = node.dataScope,
        parentScope = parent && parent.dataScope;

    return !utils.isEmpty(parentScope) ?
        !utils.isEmpty(dataScope) ?
            parentScope + '.' + dataScope :
            parentScope :
        dataScope || '';
}

This means value is populated with an observable whose initial value comes from

requirejs('uiRegistry').get('cms_page_form.page_form_data_source').data.title