{"componentChunkName":"component---src-templates-posts-article-template-tsx","path":"/articles/react-performance","result":{"pageContext":{"article":{"postDate":"Apr. 24, 2020","pathPrefix":"articles","path":"articles/react-performance","readingTime":{"text":"7 minute read","minutes":6.684,"words":1671,"time":401040},"id":"c759d75f-54ad-522e-b250-5db6f1d1092d","title":"Performance in React","node_locale":"en","excerpt":"Once a React application grows, maintenance becomes daunting. To prepare for this eventuality, we need to focus on optimization, type safety, testing, and project structure.","slug":"react-performance","shortUrl":"re-perform","canonical":null,"featured":null,"publicationDate":"Apr. 28, 2020","updatedAt":"May. 26, 2020","hero":{"CardPreview":{"aspectRatio":1.7647058823529411,"src":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=680&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=170&q=100 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=340&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=355&q=100 626w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=680&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=170&q=100&fm=webp 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=340&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=355&q=100&fm=webp 626w","sizes":"(max-width: 1200px) 100vw, 1200px"},"Article__Featured":{"aspectRatio":1.4545454545454546,"src":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=825&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=206&q=100 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=413&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100 626w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=825&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=206&q=100&fm=webp 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=413&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100&fm=webp 626w","sizes":"(max-width: 1200px) 100vw, 1200px"},"Article__Hero":{"aspectRatio":1.4545454545454546,"src":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=3200&h=2200&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100 626w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=3200&h=2200&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100&fm=webp 626w","sizes":"(max-width: 3200px) 100vw, 3200px"}},"author":{"id":"e309bf41-add3-5ab7-a88c-872d394e436e","name":"Bishal Roka ","title":"Chief Marketing Officer","slug":"Bishal-Roka","biography":{"childRichTextHtml":{"html":"<p>Bishal Roka </p>"}},"avatar":{"small":{"aspectRatio":1,"src":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=16&h=16&q=100 16w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=32&h=32&q=100 32w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100 64w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=96&h=96&q=100 96w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=128&h=128&q=100 128w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=192&h=192&q=100 192w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100 1112w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=16&h=16&q=100&fm=webp 16w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=32&h=32&q=100&fm=webp 32w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100&fm=webp 64w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=96&h=96&q=100&fm=webp 96w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=128&h=128&q=100&fm=webp 128w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=192&h=192&q=100&fm=webp 192w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100&fm=webp 1112w","sizes":"(max-width: 64px) 100vw, 64px"},"large":{"aspectRatio":1,"src":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=100&h=100&q=100 100w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=200&h=200&q=100 200w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100 400w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=600&h=600&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=800&h=800&q=100 800w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100 1112w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=100&h=100&q=100&fm=webp 100w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=200&h=200&q=100&fm=webp 200w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100&fm=webp 400w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=600&h=600&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=800&h=800&q=100&fm=webp 800w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100&fm=webp 1112w","sizes":"(max-width: 400px) 100vw, 400px"}}},"body":"<h1>Performance in React</h1><p>Once a React application grows, maintenance becomes a priority. To prepare for this eventuality, we’ll cover performance optimization, type safety, testing, and project structure. Each can strengthen your app to take on more functionality without losing quality.</p><p>Performance optimization prevents applications from slowing down by assuring efficient use of available resource. Typed programming languages like TypeScript detect bugs earlier in the feedback loop. Testing gives us more explicit feedback than typed programming, and provides a way to understand which actions can break the application. Lastly, project structure supports the organized management of assets into folders and files, which is especially useful in scenarios where team members work in different domains.</p><h2>Performance in React</h2><p>This section is just here for the sake of learning about performance improvements in React. We wouldn’t need optimizations in most React applications, as React is fast out of the box. While more sophisticated tools exist for performance measurements in JavaScript and React, we will stick to a simple <code>console.log()</code> and our browser’s developer tools for the logging output.</p><h3>Don’t run on first render</h3><p>Previously we covered React’s useEffect Hook, which is used for side-effects. It runs the first time a component renders (mounting), and then every re-render (updating). By passing an empty dependency array to it as a second argument, we can tell the hook to run on the first render only. Out of the box, there is no way to tell the hook to run only on every re-render (update) and not on the first render (mount). For instance, examine this custom hook for state management with React’s <code>useStat</code>e Hook and its semi persistent state with local storage using React’s <code>useEffect</code> Hook:</p>\n\n```js\nconst useSemiPersistentState = (key, initialState) => {\n  const [value, setValue] = React.useState(\n    localStorage.getItem(key) || initialState\n  );\n\n  React.useEffect(() => {\n    console.log('A');\n\n    localStorage.setItem(key, value);\n  }, [value, key]);\n\n  return [value, setValue];\n};\n```\n\n<p>With a closer look at the developer’s tools, we can see the log for a first time render of the component using this custom hook. It doesn’t make sense to run the side-effect for the initial rendering of the component, because there is nothing to store in the local storage except the initial value. It’s a redundant function invocation, and should only run for every update (re-rendering) of the component.</p><p>As mentioned, there is no React Hook that runs on every re-render, and there is no way to tell the <code>useEffect</code> hook in a React idiomatic way to call its function only on every re-render. However, by using React’s useRef Hook which keeps its <code>ref.current</code> property intact over re-renders, we can keep a <i>made up state</i> (without re-rendering the component on state updates) of our component’s lifecycle:</p>\n\n```js\nconst useSemiPersistentState = (key, initialState) => {\n\n  const isMounted = React.useRef(false);\n\n\n  const [value, setValue] = React.useState(\n    localStorage.getItem(key) || initialState\n  );\n\n  React.useEffect(() => {\n\n    if (!isMounted.current) {\n      isMounted.current = true;\n    } else {\n\n      console.log('A');\n      localStorage.setItem(key, value);\n\n    }\n\n  }, [value, key]);\n\n  return [value, setValue];\n};\n```\n\n<p>We are exploiting the <code>ref</code> and its mutable <code>current</code> property for imperative state management that doesn’t trigger a re-render. Once the hook is called from its component for the first time (component render), the ref’s <code>current</code> is initialized with a <code>false</code> boolean called <code>isMounted</code>. As a result, the side-effect function in <code>useEffect</code> isn’t called; only the boolean flag for <code>isMounted</code> is toggled to <code>true</code> in the side-effect. Whenever the hook runs again (component re-render), the boolean flag is evaluated in the side-effect. Since it’s <code>true</code>, the side-effect function runs. Over the lifetime of the component, the <code>isMounted</code> boolean will remain<code>true</code>. It was there to avoid calling the side-effect function for the first time render that uses our custom hook.</p><p>The above was only about preventing the invocation of one simple function for a component rendering for the first time. But imagine you have an expensive computation in your side-effect, or the custom hook is used frequently in the application. It’s more practical to deploy this technique to avoid unnecessary function invocations.</p><h3>Don’t re-render if not needed</h3><p>Earlier, we explored React’s re-rendering mechanism. We’ll repeat this exercise for the App and List components. For both components, add a logging statement.</p>\n\n```js\nconst App = () => {\n  .....\n\n  console.log('B:App');\n  return ( .... );\n};\n\nconst List = ({ list, onRemoveItem }) =>\n\n  console.log('B:List') ||\n\n  list.map(item => (\n    <Item\n      key={item.objectID}\n      item={item}\n      onRemoveItem={onRemoveItem}\n    />\n  ));\n```\n\n<p>Because the List component has no function body, and developers are lazy folks who don’t want to refactor the component for a simple logging statement, the List component uses the <code>||</code> operator instead. This is a neat trick for adding a logging statement to a function component without a function body. Since the <code>console.log()</code> on the left hand side of the operator always evaluates to false, the right hand side of the operator gets always executed.</p>\n\n```js\nfunction getTheTruth() {\n  if (console.log('B:List')) {\n    return true;\n  } else {\n    return false;\n  }\n}\n\nconsole.log(getTheTruth());\n// B:List\n// false\n```\n\n<p>Let’s focus on the actual logging in the browser’s developer tools. You should see a similar output. First the App component renders, followed by its child components (e.g. List component).</p>\n\n```js\nB:App\nB:List\nB:App\nB:App\nB:List\n```\n\n<p>Since a side-effect triggers data fetching after the first render, only the App component renders, because the List component is replaced by a loading indicator in a conditional rendering. Once the data arrives, both components render again.</p>\n\n```js\n// initial render\nB:App\nB:List\n \n// data fetching with loading\nB:App\n \n// re-rendering with data\nB:App\nB:List\n```\n\n<p>So far, this behavior is acceptable, since everything renders on time. Now we’ll take this experiment a step further, by typing into the SearchForm component’s input field. You should see the changes with every character entered into the element:</p>\n\n```js\nB:App\nB:List\n```\n\n<p>But the List component shouldn’t re-render. The search feature isn’t executed via its button, so the <code>list</code> passed to the List component should remain the same. This is React’s default behavior, which surprises many people.</p><p>If a parent component re-renders, its child components re-render as well. React does this by default, because preventing a re-render of child components could lead to bugs, and the re-rendering mechanism of React is still fast.</p><p>Sometimes we want to prevent re-rendering, however. For instance, huge data sets displayed in a table shouldn’t re-render if they are not affected by an update. It’s more efficient to perform an equality check if something changed for the component. Therefore, we can use React’s memo API to make this equality check for the props:</p>\n\n```js\nconst List = React.memo(\n  ({ list, onRemoveItem }) =>\n    console.log('B:List') ||\n    list.map(item => (\n      <Item\n        key={item.objectID}\n        item={item}\n        onRemoveItem={onRemoveItem}\n      />\n    ))\n\n);\n```\n\n<p>However, the output stays the same when typing into the SearchForm’s input field:</p>\n\n```js\nB:App\nB:List\n```\n\n<p>The <code>list</code> passed to the List component is the same, but the <code>onRemoveItem</code> callback handler isn’t. If the App component re-renders, it always creates a new version of this callback handler. Earlier, we used React’s useCallacbk Hook to prevent this behavior, by creating a function only on a re-render (if one of its dependencies has changed).</p>\n\n```js\nconst App = () => {\n  ...\n\n\n  const handleRemoveStory = React.useCallback(item => {\n\n    dispatchStories({\n      type: 'REMOVE_STORY',\n      payload: item,\n    });\n\n  }, []);\n\n\n  ...\n\n  console.log('B:App');\n\n  return (... );\n};\n```\n\n<p>Since the callback handler gets the <code>item</code> passed as an argument in its function signature, it doesn’t have any dependencies and is declared only once when the App component initially renders. None of the props passed to the List component should change now. Try it with the combination of <code>memo</code> and <code>useCallback</code>, to search via the SearchForm’s input field. The “B:List” output disappears, and only the App component re-renders with its “B:App” output.</p><p>While all props passed to a component stay the same, the component renders again if its parent component is forced to re-render. That’s React’s default behavior, which works most of the time because the re-rendering mechanism is fast enough. However, if re-rendering decreases the performance of a React application, <code>memo</code> helps prevent re-rendering.</p><p>Sometimes <code>memo</code> alone doesn’t help, though. Callback handlers are re-defined each time in the parent component and passed as <i>changed</i> props to the component, which causes another re-render. In that case, <code>useCallback</code> is used for making the callback handler only change when its dependencies change.</p><h3>Don’t rerun expensive computations <a href=https://www.educative.io/courses/road-to-react-with-hooks/g7DJ5QvnjDY#dont-rerun-expensive-computations target=\"_blank\" rel=\"noopener\"></a></h3><p>Sometimes we’ll have performance-intensive computations in our React components – between a component’s function signature and return block – which run on every render. For this scenario, we must create a use case in our current application first.</p>\n\n```js\nconst getSumComments = stories => {\n  console.log('C');\n\n  return stories.data.reduce(\n    (result, value) => result + value.num_comments,\n    0\n  );\n};\n\n\nconst App = () => {\n  ...\n\n  const sumComments = getSumComments(stories);\n\n  return (\n    <div>\n\n      <h1>My Hacker Stories with {sumComments} comments.</h1>\n\n      ...\n    </div>\n  );\n};\n```\n\n<p>If all arguments are passed to a function, it’s acceptable to have it outside the component. It prevents creating the function on every render, so the <code>useCallback</code> hook becomes unnecessary. The function still computes the value of summed comments on every render, which becomes a problem for more expensive computations.</p><p>Each time text is typed in the input field of the SearchForm component, this computation runs again with an output of “C”. This may be fine for a non-heavy computation like this one, but imagine this computation would take more than 500ms. It would give the re-rendering a delay, because everything in the component has to wait for this computation. We can tell React to only run a function if one of its dependencies has changed. If no dependency changed, the result of the function stays the same. React’s useMemo Hook helps us here:</p>\n\n```js\nconst App = () => {\n  ...\n\n  const sumComments = React.useMemo(() => getSumComments(stories), [\n    stories,\n  ]);\n\n\n  return ( ... );\n};\n```\n\n<p>For every time someone types in the SearchForm, the computation shouldn’t run again. It only runs if the dependency array, here <code>stories</code>, has changed. After all, this should only be used for cost expensive computations which could lead to a delay of a (re-)rendering of a component.</p><p>Now, after we went through these scenarios for <code>useMemo</code>, <code>useCallback</code>, and <code>memo</code>, remember that these shouldn’t necessarily be used by default. Apply these performance optimization only if you run into a performance bottlenecks. Most of the time this shouldn’t happen, because React’s rendering mechanism is pretty efficient by default. Sometimes the check for utilities like <code>memo</code> can be more expensive than the re-rendering itself.</p>","backgroundImage":{"fluid":{"aspectRatio":3,"src":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1140&h=380&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=285&h=95&q=100 285w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=570&h=190&q=100 570w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1140&h=380&q=100 1140w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1710&h=570&q=100 1710w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1920&h=640&q=100 1920w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1140&h=380&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=285&h=95&q=100&fm=webp 285w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=570&h=190&q=100&fm=webp 570w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1140&h=380&q=100&fm=webp 1140w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1710&h=570&q=100&fm=webp 1710w,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1920&h=640&q=100&fm=webp 1920w","sizes":"(max-width: 1140px) 100vw, 1140px"},"seo":{"width":1200,"height":630,"src":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1200&h=630&q=100&fit=fill","srcSet":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1200&h=630&q=100&fit=fill 1x,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1800&h=945&q=100&fit=fill 1.5x","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1200&h=630&q=100&fm=webp&fit=fill","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1200&h=630&q=100&fm=webp&fit=fill 1x,\n//images.ctfassets.net/mn39h0tra6wf/6lNziLO0oSx6Y3JMfj540b/fce63831bdbf7ca22f34be9c7f9da599/you-dont-need-microservices.png?w=1800&h=945&q=100&fm=webp&fit=fill 1.5x"}},"backgroundColor":"#3F404A"},"slug":"articles/react-performance","id":"c759d75f-54ad-522e-b250-5db6f1d1092d","title":"Performance in React","next":[{"postDate":"Apr. 24, 2020","pathPrefix":"articles","path":"articles/building-random","readingTime":{"text":"1 minute read","minutes":1.232,"words":308,"time":73920},"id":"d09aa197-495a-5033-bdb8-4646ba802933","title":"The Importance of Clarifying the Brand Message","node_locale":"en","excerpt":"We all know every business spends a huge amount of capital on marketing. But most of them fail why? ","slug":"building-random","shortUrl":"product-market-fit","canonical":null,"featured":false,"publicationDate":"May. 21, 2019","updatedAt":"Feb. 26, 2022","hero":{"CardPreview":{"aspectRatio":1.7647058823529411,"src":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=680&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=300&h=170&q=100 300w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=600&h=340&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=680&q=100 1200w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1800&h=1020&q=100 1800w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=2400&h=1360&q=100 2400w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3600&h=2040&q=100 3600w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=680&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=300&h=170&q=100&fm=webp 300w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=600&h=340&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=680&q=100&fm=webp 1200w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1800&h=1020&q=100&fm=webp 1800w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=2400&h=1360&q=100&fm=webp 2400w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3600&h=2040&q=100&fm=webp 3600w","sizes":"(max-width: 1200px) 100vw, 1200px"},"Article__Featured":{"aspectRatio":1.4545454545454546,"src":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=825&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=300&h=206&q=100 300w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=600&h=413&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=825&q=100 1200w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1800&h=1238&q=100 1800w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=2400&h=1650&q=100 2400w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3600&h=2475&q=100 3600w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=825&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=300&h=206&q=100&fm=webp 300w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=600&h=413&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1200&h=825&q=100&fm=webp 1200w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1800&h=1238&q=100&fm=webp 1800w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=2400&h=1650&q=100&fm=webp 2400w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3600&h=2475&q=100&fm=webp 3600w","sizes":"(max-width: 1200px) 100vw, 1200px"},"Article__Hero":{"aspectRatio":1.4545454545454546,"src":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3200&h=2200&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=800&h=550&q=100 800w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1600&h=1100&q=100 1600w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3200&h=2200&q=100 3200w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3200&h=2200&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=800&h=550&q=100&fm=webp 800w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=1600&h=1100&q=100&fm=webp 1600w,\n//images.ctfassets.net/mn39h0tra6wf/5TV17a1qXidaGWQOTPmL7I/aa736af14d6c310da7bafc9074977f44/BRAND_MESSAGE__1_.png?w=3200&h=2200&q=100&fm=webp 3200w","sizes":"(max-width: 3200px) 100vw, 3200px"}},"author":{"id":"078c22dd-d13e-5729-99e0-68e14d874758","name":"Bishal Roka","title":"Chief Marketing Officer","slug":null,"biography":null,"avatar":null},"body":"<p>We all know every business spends a huge amount of capital on marketing. But most of them fail why? It’s not because of their product or services it because of their uncleared message to the customers which makes them confusing to understand. People don’t buy the best products. They buy the products they understand the fastest. The more simple and predictable the communication the easier it is to understand.</p><p><b>Why clarity is important for brand communication? </b></p><p>Clarified messages improve the connection and engagement towards brands because it increases the trust and transparency with the audience. The more clear message the higher the chances of getting more sales. Let’s take the example of Apple if you have noticed the Apple advertisement they have inserted them into their customer’s story like no other technology company, the story of Apple isn’t about Apple it’s about us. As websites don’t sell things. Words sell things. Let’s take another example of their recently launched product, <b>Air Tag</b> where they have placed the clear tagline on their website <b>“Lose your knack for losing things” </b>which clarifies the product perfectly. </p><p><b>Are you confusing your customer? </b></p><p>There is a saying in marketing that “Confused customers are lost sales”. Yet many businesses have the misconception that a confused customer will seek clarification and they will contact you for more information. But the truth is <b>if you confuse them, you will lose them. </b>Clarity is the only way to make a great impact on your audience. If you make your message clear towards the audience you can build trust and also increase the leads, which you can convert into sales further. </p><p>Hence businesses should stop confusing their customer. To gain an audience that will be loyal to your brand, you should be able to make clarity on the message so people will not get confused about your brand and can make their buying decision based on what they hear.</p><p></p>","backgroundImage":{"fluid":{"aspectRatio":3,"src":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1140&h=380&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=285&h=95&q=100 285w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=570&h=190&q=100 570w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1140&h=380&q=100 1140w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1710&h=570&q=100 1710w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=2280&h=760&q=100 2280w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=3420&h=1140&q=100 3420w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1140&h=380&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=285&h=95&q=100&fm=webp 285w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=570&h=190&q=100&fm=webp 570w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1140&h=380&q=100&fm=webp 1140w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1710&h=570&q=100&fm=webp 1710w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=2280&h=760&q=100&fm=webp 2280w,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=3420&h=1140&q=100&fm=webp 3420w","sizes":"(max-width: 1140px) 100vw, 1140px"},"seo":{"width":1200,"height":630,"src":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1200&h=630&q=100&fit=fill","srcSet":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1200&h=630&q=100&fit=fill 1x,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1800&h=945&q=100&fit=fill 1.5x,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=2400&h=1260&q=100&fit=fill 2x,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=3600&h=1890&q=100&fit=fill 3x","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1200&h=630&q=100&fm=webp&fit=fill","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1200&h=630&q=100&fm=webp&fit=fill 1x,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=1800&h=945&q=100&fm=webp&fit=fill 1.5x,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=2400&h=1260&q=100&fm=webp&fit=fill 2x,\n//images.ctfassets.net/mn39h0tra6wf/3hJd8ZCsUvMzxXcWABWwPx/8cd49b3812656571067a750fb103a513/BRAND_MESSAGE.png?w=3600&h=1890&q=100&fm=webp&fit=fill 3x"}},"backgroundColor":"F9F8E9"},{"postDate":"Apr. 24, 2020","pathPrefix":"articles","path":"articles/lead-generation","readingTime":{"text":"2 minute read","minutes":2.232,"words":558,"time":133920.00000000003},"id":"e269e477-ac48-5ecf-888d-64b298773284","title":"The Three Important Lead Generation Tactics","node_locale":"en","excerpt":"Do you want to generate more leads for your business? Let's look at the 3 main lead generation tactics and how these tactics can help you to generate more leads for your business. ","slug":"lead-generation","shortUrl":"leag-gen","canonical":null,"featured":false,"publicationDate":"Apr. 2, 2019","updatedAt":"Mar. 1, 2022","hero":{"CardPreview":{"aspectRatio":1.7647058823529411,"src":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=680&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=170&q=100 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=340&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=355&q=100 626w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=680&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=170&q=100&fm=webp 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=340&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=355&q=100&fm=webp 626w","sizes":"(max-width: 1200px) 100vw, 1200px"},"Article__Featured":{"aspectRatio":1.4545454545454546,"src":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=825&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=206&q=100 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=413&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100 626w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=1200&h=825&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=300&h=206&q=100&fm=webp 300w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=600&h=413&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100&fm=webp 626w","sizes":"(max-width: 1200px) 100vw, 1200px"},"Article__Hero":{"aspectRatio":1.4545454545454546,"src":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=3200&h=2200&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100 626w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=3200&h=2200&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/7wXLUWI4bu7aHXigI9O6tR/b97dfd196b69963422795f31bf5b67a0/elegant-golden-pattern-background-design_1017-13782.jpg?w=626&h=430&q=100&fm=webp 626w","sizes":"(max-width: 3200px) 100vw, 3200px"}},"author":{"id":"e309bf41-add3-5ab7-a88c-872d394e436e","name":"Bishal Roka ","title":"Chief Marketing Officer","slug":"Bishal-Roka","biography":{"childRichTextHtml":{"html":"<p>Bishal Roka </p>"}},"avatar":{"small":{"aspectRatio":1,"src":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=16&h=16&q=100 16w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=32&h=32&q=100 32w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100 64w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=96&h=96&q=100 96w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=128&h=128&q=100 128w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=192&h=192&q=100 192w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100 1112w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=16&h=16&q=100&fm=webp 16w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=32&h=32&q=100&fm=webp 32w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=64&h=64&q=100&fm=webp 64w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=96&h=96&q=100&fm=webp 96w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=128&h=128&q=100&fm=webp 128w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=192&h=192&q=100&fm=webp 192w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100&fm=webp 1112w","sizes":"(max-width: 64px) 100vw, 64px"},"large":{"aspectRatio":1,"src":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=100&h=100&q=100 100w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=200&h=200&q=100 200w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100 400w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=600&h=600&q=100 600w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=800&h=800&q=100 800w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100 1112w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=100&h=100&q=100&fm=webp 100w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=200&h=200&q=100&fm=webp 200w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=400&h=400&q=100&fm=webp 400w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=600&h=600&q=100&fm=webp 600w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=800&h=800&q=100&fm=webp 800w,\n//images.ctfassets.net/mn39h0tra6wf/40GPT8RxXNNBqoQNTkHBPq/e8c8bea306f1b95c7ddf6d86992c3809/musezadenew.png?w=1112&h=1112&q=100&fm=webp 1112w","sizes":"(max-width: 400px) 100vw, 400px"}}},"body":"<p>Lead Generation is the most talked about topic in the world of marketing. Is it helpful in terms of developing the business? And how can businesses implement an effective lead generation strategy whether it is a million-dollar business or just a start-up? In the growing digital era does the business need to focus on online lead generation more?</p><p>Basically, lead refer to contact with a potential customer. In simple words, a Lead is a person who has expressed interest in what you have to offer. A potential lead can be obtained through word of mouth, phone calls, emails, websites, or advertisements.</p><p>Digital lead generation is the process of using inbound and outbound marketing to generate interest in what you have to offer for others. It provides your business with the opportunity to grow. The digital ear has changed the way we do business and it’s important for marketers to keep up with the demand of their prospect by building tailored lead generation strategists. </p><p>The buying process of people these days have completely changed. Customers are no longer attracted by flashy old advertisement techniques. So, business today is heavily dependent on lead generation as it enables more traffic and engagement to their website and social media handle which further can be converted into the sales opportunity. As in the growing trend and possibility of online lead generation, still, many companies aren’t aware that lead generation allows them to get more traffic and create an impact of their products and services in the consumer mind.</p><p>The three most important tactics that every business need to master for lead generation are as follows:</p><p><b>Search Engine Optimization (SEO)</b></p><p>Search Engine Optimization (SEO) is the process of improving the website or web pages to drive more traffic into it. SEO is an excellent lead generation method that drives more relevant traffic to your website. The main role of SEO is to rank the website higher based on keyword placement. The better you can rank your keywords, the better your website can achieve traffic. More traffic means more opportunities for possible leads.<b> </b></p><p><b>Social Media Marketing (SSM)</b></p><p>Social Media is a key platform to promote your business right now. The rapid increase in social media users indicates how big opportunities are available here in terms of lead generation. Through the help of social media, you can build relationships with your customers and targeted audience. Social media has become the biggest hub of connecting people to products and services they want. Social media also play an important role while making a purchase decision. In today’s context businesses need to be on social media like Facebook, Instagram, Twitter, Linked In, etc. The more you are active on social media, the more connected your customer feels.</p><p><b>Content Marketing</b></p><p>As we say content is king in digital. No matter how you slice the pie the content will forever be important when it comes to lead generation. Creating content that is relevant to customers can engage them as it provides knowledge to the interested audience. When you have interesting content on your website, visitors will also spend more time on your website. The more creative you deliver the content, the more possible opportunity you create for leads.  </p><p>Therefore, lead generation is important for your business. It creates sales opportunities and increases organic customers for your business. So having a more engaging website and social media will increase the chance of converting lead into a customer.  </p>","backgroundImage":{"fluid":{"aspectRatio":3,"src":"//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=1140&h=380&q=100","srcSet":"//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=285&h=95&q=100 285w,\n//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=570&h=190&q=100 570w,\n//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=1047&h=349&q=100 1047w","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=1140&h=380&q=100&fm=webp","srcSetWebp":"//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=285&h=95&q=100&fm=webp 285w,\n//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=570&h=190&q=100&fm=webp 570w,\n//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=1047&h=349&q=100&fm=webp 1047w","sizes":"(max-width: 1140px) 100vw, 1140px"},"seo":{"width":1200,"height":630,"src":"//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=1200&h=630&q=100&fit=fill","srcSet":"","srcWebp":"//images.ctfassets.net/mn39h0tra6wf/6jwnLSTJAgaQ8bF2QJtdTJ/e39dd798e1fe7e10348830b819c98512/1611587385789.jfif?w=1200&h=630&q=100&fm=webp&fit=fill","srcSetWebp":""}},"backgroundColor":"#111216"}]}}}