# createAdvAgent

## `createAdvAgent(areaName, bearingPropOrBuilder)`

This factory function is identical to `createAgent()` the difference is in the processing of anonimous instances of objects created inplace on the react render stage

### The problem

When we create variables in component like this:

```javascript
const Component = props = {
  const element = <div/>
  const array = []
  const object = {}
  const function = ()=>()
  const string = ""
  return (
    <Agent {...{element, array, object, function, string}} />
  )
}
```

All the variables: `element`, `array`, `object`, `function`, (but not a `string`) contains new unique instance of appropriate entity each time when the component is rendered. So once a new instance is receiving that cause new rerender which becom indefinite process.

This case appears only for case when through-container has through-agent as one of its children or some of subchildren at any depths.

Strings actually also represent itself new instance but different from point of comparision. React state and delarative aprroach at all typicaly based on shallow compare to figure out state changes to initiate update process. Two different objects (and so on) are not equal `{} !== {}` even has identical content, but string `'' == ''` are equal. So components with string props created inplace in render stage has not this problem.

## The rule of two conditions

In all the case `createAdvAgent()` is preferable due to it is more efficient, except when this rule satisfied:

The function `createAgent()` must be used instead of `createAdvAgent()` when match both of this conditions:

* one or more of agent props contains new instance created each render without condition&#x20;
* through-container uses same area as the one of its child through-agents

### Example

```javascript
const Agent = createAgent('myarea', 'id')
const AdvAgent = createAdvAgent('myarea', 'id')

const memoized = React.useMemo({}, [])

<div>
  <Through area='myarea'>
    {(area) => {
      <div>

        worked: due to not advanced agent is used
        <Agent area='myarea' data={[]} />

        bad: due to same area as parent container
        <AdvAgent area='myarea' data={[]} />

        good: because there is no props with new instance
        <AdvAgent area='myarea' data='' />

        good: because memoized value is used
        <AdvAgent area='myarea' data={memoized} />
      </div>
    }
  </Through>

  good: because this is not (sub)children of container with same area 
  <AdvAgent area='myarea' data={[]} />

</div>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://react-through.js.org/api/createadvagent.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.