Optimizations to improve performance on complex conditional schemas

packages/core/src/components/fields/SchemaField.js

@@ -251,6 +251,7 @@ function SchemaFieldRender(props) {
     uiSchema["ui:FieldTemplate"] || registry.FieldTemplate || DefaultTemplate;
   let idSchema = props.idSchema;
   const schema = retrieveSchema(props.schema, rootSchema, formData);
+
   idSchema = mergeObjects(
     toIdSchema(schema, null, rootSchema, formData, idPrefix, idSeparator),
     idSchema
@@ -404,7 +405,6 @@ function SchemaFieldRender(props) {
     </FieldTemplate>
   );
 }
-
 class SchemaField extends React.Component {
   shouldComponentUpdate(nextProps, nextState) {
     return !deepEquals(this.props, nextProps);

packages/core/src/utils.js

@@ -7,7 +7,11 @@ import jsonpointer from "jsonpointer";
 import fields from "./components/fields";
 import widgets from "./components/widgets";
 import validateFormData, { isValid } from "./validate";
+import memoize from "lodash/memoize";
 
+// Use the same default object to optimize memoized functions that rely on referential equality
+const DEFAULT_ROOT_SCHEMA = {};
+const DEFAULT_FORM_DATA = {};
 export const ADDITIONAL_PROPERTY_FLAG = "__additional_property";
 
 const widgetMap = {
@@ -171,11 +175,14 @@ export function hasWidget(schema, widget, registeredWidgets = {}) {
   }
 }
 
-function computeDefaults(
+const cacheKeyFn = (...args) => args.map(arg => JSON.stringify(arg)).join("_");
+const computeDefaults = memoize(_computeDefaults, cacheKeyFn);
+
+function _computeDefaults(
   _schema,
   parentDefaults,
   rootSchema,
-  rawFormData = {},
+  rawFormData = DEFAULT_FORM_DATA,
   includeUndefinedValues = false
 ) {
   let schema = isObject(_schema) ? _schema : {};
@@ -189,6 +196,8 @@ function computeDefaults(
   } else if ("default" in schema) {
     // Use schema defaults for this node.
     defaults = schema.default;
+  } else if ("const" in schema) {
+    defaults = schema.const;
   } else if ("$ref" in schema) {
     // Use referenced schema defaults for this node.
     const refSchema = findSchemaDefinition(schema.$ref, rootSchema);
@@ -301,7 +310,7 @@ function computeDefaults(
 export function getDefaultFormState(
   _schema,
   formData,
-  rootSchema = {},
+  rootSchema = DEFAULT_ROOT_SCHEMA,
   includeUndefinedValues = false
 ) {
   if (!isObject(_schema)) {
@@ -522,7 +531,7 @@ export function toConstant(schema) {
   }
 }
 
-export function isSelect(_schema, rootSchema = {}) {
+export function isSelect(_schema, rootSchema = DEFAULT_ROOT_SCHEMA) {
   const schema = retrieveSchema(_schema, rootSchema);
   const altSchemas = schema.oneOf || schema.anyOf;
   if (Array.isArray(schema.enum)) {
@@ -533,14 +542,18 @@ export function isSelect(_schema, rootSchema = {}) {
   return false;
 }
 
-export function isMultiSelect(schema, rootSchema = {}) {
+export function isMultiSelect(schema, rootSchema = DEFAULT_ROOT_SCHEMA) {
   if (!schema.uniqueItems || !schema.items) {
     return false;
   }
   return isSelect(schema.items, rootSchema);
 }
 
-export function isFilesArray(schema, uiSchema, rootSchema = {}) {
+export function isFilesArray(
+  schema,
+  uiSchema,
+  rootSchema = DEFAULT_ROOT_SCHEMA
+) {
   if (uiSchema["ui:widget"] === "files") {
     return true;
   } else if (schema.items) {
@@ -594,7 +607,7 @@ export function optionsList(schema) {
   }
 }
 
-export function findSchemaDefinition($ref, rootSchema = {}) {
+export function findSchemaDefinition($ref, rootSchema = DEFAULT_ROOT_SCHEMA) {
   const origRef = $ref;
   if ($ref.startsWith("#")) {
     // Decode URI fragment representation.
@@ -635,8 +648,8 @@ export const guessType = function guessType(value) {
 // This function will create new "properties" items for each key in our formData
 export function stubExistingAdditionalProperties(
   schema,
-  rootSchema = {},
-  formData = {}
+  rootSchema = DEFAULT_ROOT_SCHEMA,
+  formData = DEFAULT_FORM_DATA
 ) {
   // Clone the schema so we don't ruin the consumer's original
   schema = {
@@ -704,12 +717,18 @@ const resolveCondition = (schema, rootSchema, formData) => {
   }
 };
 
+export const resolveSchema = memoize(_resolveSchema, cacheKeyFn);
+
 /**
  * Resolves references and dependencies within a schema and its 'allOf' children.
  *
  * Called internally by retrieveSchema.
  */
-export function resolveSchema(schema, rootSchema = {}, formData = {}) {
+export function _resolveSchema(
+  schema,
+  rootSchema = DEFAULT_ROOT_SCHEMA,
+  formData = DEFAULT_FORM_DATA
+) {
   if (schema.hasOwnProperty("$ref")) {
     return resolveReference(schema, rootSchema, formData);
   } else if (schema.hasOwnProperty("dependencies")) {
@@ -723,7 +742,8 @@ export function resolveSchema(schema, rootSchema = {}, formData = {}) {
       ),
     };
   } else {
-    // No $ref or dependencies attribute found, returning the original schema.
+    // No $ref, dependencies, or allOf attribute found, so there's nothing to resolve.
+    // Returning the original schema.
     return schema;
   }
 }
@@ -741,9 +761,13 @@ function resolveReference(schema, rootSchema, formData) {
   );
 }
 
-export function retrieveSchema(schema, rootSchema = {}, formData = {}) {
+export function _retrieveSchema(
+  schema,
+  rootSchema = DEFAULT_ROOT_SCHEMA,
+  formData = DEFAULT_FORM_DATA
+) {
   if (!isObject(schema)) {
-    return {};
+    return DEFAULT_ROOT_SCHEMA;
   }
   let resolvedSchema = resolveSchema(schema, rootSchema, formData);
 
@@ -763,19 +787,24 @@ export function retrieveSchema(schema, rootSchema = {}, formData = {}) {
       return resolvedSchemaWithoutAllOf;
     }
   }
+
   const hasAdditionalProperties =
     resolvedSchema.hasOwnProperty("additionalProperties") &&
     resolvedSchema.additionalProperties !== false;
+
   if (hasAdditionalProperties) {
-    return stubExistingAdditionalProperties(
+    resolvedSchema = stubExistingAdditionalProperties(
       resolvedSchema,
       rootSchema,
       formData
     );
   }
+
   return resolvedSchema;
 }
 
+export const retrieveSchema = memoize(_retrieveSchema, cacheKeyFn);
+
 function resolveDependencies(schema, rootSchema, formData) {
   // Drop the dependencies from the source schema.
   let { dependencies = {}, ...resolvedSchema } = schema;
@@ -1046,7 +1075,7 @@ export function toIdSchema(
   schema,
   id,
   rootSchema,
-  formData = {},
+  formData = DEFAULT_FORM_DATA,
   idPrefix = "root",
   idSeparator = "_"
 ) {
@@ -1087,7 +1116,12 @@ export function toIdSchema(
   return idSchema;
 }
 
-export function toPathSchema(schema, name = "", rootSchema, formData = {}) {
+export function toPathSchema(
+  schema,
+  name = "",
+  rootSchema,
+  formData = DEFAULT_FORM_DATA
+) {
   const pathSchema = {
     $name: name.replace(/^\./, ""),
   };