{"id":79681,"date":"2017-09-29T11:10:08","date_gmt":"2017-09-29T11:10:08","guid":{"rendered":"http:\/\/www.esri.com\/arcgis-blog\/products\/product\/uncategorized\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\/"},"modified":"2019-11-04T14:01:58","modified_gmt":"2019-11-04T22:01:58","slug":"featurelayer-rendering-taking-advantage-of-webgl-in-2d","status":"publish","type":"blog","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d","title":{"rendered":"FeatureLayer rendering: taking advantage of WebGL in 2D"},"author":6561,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"_searchwp_excluded":""},"categories":[22941],"tags":[24921,27491,30321,29541,28501,34641],"industry":[],"product":[36831,36601],"class_list":["post-79681","blog","type-blog","status-publish","format-standard","hentry","category-mapping","tag-javascript","tag-jsapi4","tag-performance","tag-rendering","tag-webgis","tag-webgl","product-js-api-arcgis","product-developers"],"acf":{"short_description":"The 4.5 version of the ArcGIS API for JavaScript allows users to opt in to rendering FeatureLayer with WebGL (beta) in 2D MapViews. This ...","flexible_content":[{"acf_fc_layout":"content","content":"<p>The <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/guide\/release-notes\/index.html\">4.5 version<\/a> of the ArcGIS API for JavaScript allows users to opt in to rendering FeatureLayer with <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-FeatureLayer.html#webgl-rendering\">WebGL<\/a> (beta) in <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-MapView.html\">2D MapViews<\/a>. This is a major step in improving the overall performance of <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-FeatureLayer.html\">FeatureLayer<\/a>, providing you with the ability to display more data in the view and rapidly update their visualization. For example, the WebGL-enabled FeatureLayer in the image below displays a layer containing more than one million polygons and updates the layer&#8217;s renderer at 60 frames per second as the user moves a slider.<\/p>\n<p><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-vv-color-animate\/index.html\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2931 size-full\" src=\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/featurelayer-webgl-fast-updates-optimized.gif\" alt=\"\" width=\"640\" height=\"332\" \/><\/a><\/p>\n<p>The following samples also showcase these enhancements:<\/p>\n<ul>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/layers-featurelayer-webgl\/index.html\">FeatureLayer performance improvements<\/a><\/li>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-sm-multivariate\/index.html\">Multivariate data exploration<\/a><\/li>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/views-composite-views\/index.html\">Create an app with composite views<\/a><\/li>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-vv-color-animate\/index.html\">Animate color visual variable<\/a><\/li>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-vv-opacity-animate\/index.html\">Animate opacity visual variable<\/a><\/li>\n<\/ul>\n<p><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/WebGL_API\">WebGL (Web Graphics Library)<\/a> is a JavaScript API that uses the graphics card (GPU) of your computer to display 2D or 3D graphics. WebGL is already used to render data in 3D <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-SceneView.html\">SceneViews<\/a>. The 4.5 release of the ArcGIS API for JavaScript brings the same capabilities of fast GPU rendering and interactive updates to FeatureLayer in 2D MapViews.<\/p>\n<p>Developing with WebGL to display 2D content offers greater control over how and when features are drawn on the screen, as opposed to a more general purpose drawing technology like\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/SVG\">Scalable Vector Graphics (SVG)<\/a>, which is what we currently use to render FeatureLayer in 2D. WebGL allows us to optimize the code to quickly redraw every feature on the screen when size, color, opacity, or rotation visual variables change in a renderer.<\/p>\n<p>WebGL isn&#8217;t new to 2D drawing in the ArcGIS API for JavaScript. We already use it to render <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-VectorTileLayer.html\">VectorTileLayer<\/a> in MapView. So why bother using it for FeatureLayer? Vector tiles are great for displaying basemap layers and even thematic visualizations of large datasets because of their performance benefits. However, vector tiles are a static, precooked view of the data. In contrast, FeatureLayer has a wealth of <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-FeatureLayer.html#capabilities\">dynamic capabilities<\/a>, including editing, querying\/filtering, and support for on-the-fly rendering and projecting. The FeatureLayer achieves this by working directly with the Feature Service, which can return data based on the needs of the layer. Overhauling FeatureLayer with a similar implementation as VectorTileLayer allows us to provide the user with the dynamic capabilities of FeatureLayer while taking advantage of the following benefits offered by WebGL:<\/p>\n<p>1. <a href=\"#faster-rendering\">Faster rendering<\/a><br \/>\n2. <a href=\"#more-data\">More data can be displayed in the view<\/a><\/p>\n<p><a name=\"faster-rendering\"><\/a><\/p>\n<h2>Faster rendering<\/h2>\n<p>WebGL\u00a0paves the way for improved user experiences when changing the visualization of features. This is particularly apparent in apps that provide users with UI controls that alter a layer&#8217;s renderer for data exploration or style authoring purposes. <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-vv-opacity-animate\/index.html\">Check out the sample below<\/a>, which displays 180,000 voting precinct locations. The user can move the slider to explore precincts that reported similar margins of victory for each candidate. Despite the large amount of data displayed, the visualization updates smoothly and rapidly.<\/p>\n<p><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-vv-opacity-animate\/index.html\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2931 size-full\" src=\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/fl-webgl-precincts-optimized.gif\" alt=\"\" width=\"640\" height=\"332\" \/><\/a><\/p>\n<p>Additionally, FeatureLayers rendered with WebGL support <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-layers-FeatureLayerView.html#highlight\">highlight<\/a>, which automatically appears when users click or tap features to view the popup. You can also call the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-layers-FeatureLayerView.html#highlight\">highlight()<\/a> method on the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-views-layers-FeatureLayerView.html\">FeatureLayerView<\/a> to highlight features in other workflows, such as for displaying query\/selection results and highlighting features on pointer-move events.<\/p>\n<p><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/views-composite-views\/index.html\"><img decoding=\"async\" src=\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2019\/11\/featurelayer-webgl-highlight-optimized.gif\" alt=\"featurelayer-webgl-highlight\" \/><\/a><\/p>\n<p><a name=\"more-data\"><\/a><\/p>\n<h2>More data can be displayed in the view<\/h2>\n<p>The current 2D implementation of FeatureLayer renders graphics with SVG, which limits the the number of features that can be displayed in the view. Now that all modern browsers support WebGL, we can optimize the drawing pipeline so you can display hundreds of thousands, <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/visualization-vv-color-animate\/index.html\">even millions<\/a>, of features in the browser. This prompted us to make improvements to our methodology for fetching features, and raise the limit of the number of features that we can draw in the view.<\/p>\n<p>The ArcGIS API for JavaScript already leverages feature tile queries to fetch features in a predictable way. This involves dividing the view into square tiles and spatially querying features by the extent of each tile. Because these requests are predictable, we can cache each tile in the browser, ArcGIS Online, and the CDN, effectively minimizing heavy lifting by the feature service. This improves overall querying performance by leveraging one of these caches when possible rather than querying the data directly.<\/p>\n<p>In version 4.5 we query significantly more features via <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-FeatureLayer.html#fetching-improvements\">progressive feature tile subdivisions<\/a>. For example, if the response to a single feature tile request contains more features than allowed in the <code>maxRecordCount<\/code> of the service, then that tile is subdivided into four smaller feature tiles whose extents will be used to query for more features. Feature tiles will progressively subdivide until the number of features returned for the extent of each tile is fewer than the <code>maxRecordCount<\/code>. Some features may not be returned because of limits to the number of subdivisions created per tile. We will continue to experiment with those limits so a reasonable number of features are returned. The animation below demonstrates how feature tiles subdivide when fetching features from a service containing more than 180,000 polygon records.<\/p>\n<p><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-FeatureLayer.html#fetching-improvements\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2017\/09\/tile-subdivisions.gif\" alt=\"\" width=\"480\" height=\"312\" class=\"alignnone size-full wp-image-87395 noIMGBackground\" \/><\/a><\/p>\n<p>You will notice tiles subdivide based on the location of features. Areas where smaller tiles are present indicate locations that have a higher density of features. Since this dataset represents voting precinct boundaries, it makes sense that the locations of smaller tiles correlate with the locations of large cities, which have more precincts than rural areas.<\/p>\n<h2>Enable WebGL for FeatureLayer<\/h2>\n<p>To enable rendering FeatureLayer in WebGL at 4.5, paste the following script in your application prior to loading the ArcGIS API for JavaScript in your web app:<\/p>\n<pre><span style=\"color: #000080;font-weight: normal\">&lt;<span style=\"color: #000080;font-weight: normal\">script<\/span>&gt;<\/span>\r\n  <span style=\"color: #333;font-weight: bold\">var<\/span> dojoConfig = {\r\n    has: {\r\n      <span style=\"color: #d14\">\"esri-featurelayer-webgl\"<\/span>: <span style=\"color: #008080\">1<\/span>\r\n    }\r\n  };\r\n<span style=\"color: #000080;font-weight: normal\">&lt;\/<span style=\"color: #000080;font-weight: normal\">script<\/span>&gt;<\/span>\r\n<\/pre>\n<p>This new technology is currently only available when visualizing feature services hosted on ArcGIS Online. Support for client-side feature collections and non-hosted enterprise feature services will be supported at a later release.<\/p>\n<p><a name=\"conclusion\"><\/a><\/p>\n<h2>Conclusion<\/h2>\n<p>The <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-layers-FeatureLayer.html#webgl-rendering\">WebGL implementation of FeatureLayer<\/a> is currently in <strong>beta<\/strong>. We plan on improving the speed, quality and responsiveness of the drawing process in a future release. We are actively working on using the API&#8217;s <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-core-workers.html\">web workers framework<\/a> to offload the massaging of feature tiles to a separate process. When the beta implementation reaches the same level of support as the current implementation, <strong><em>WebGL will become the default for rendering FeatureLayer in MapView.<\/em><\/strong><\/p>\n<p>Keep in mind the following limitations for rendering 2D FeatureLayers with WebGL at 4.5:<\/p>\n<ul>\n<li>Support is limited to layers created from feature services hosted on ArcGIS Online. Non-hosted enterprise feature services and client-side feature collections will be supported in a future release.<\/li>\n<li>Executing query methods on the FeatureLayerView is not supported.<\/li>\n<li>Locations with a very high density of features at large scales may not display all available features at small scales.<\/li>\n<li>Very large datasets may require potentially long initial load times, particularly at small scales. Server-side and client-side feature tile caching allow features to load much faster after the initial data download. More research and development will be invested in improving the efficiency of load times.<\/li>\n<\/ul>\n<p>Happy coding!<br \/>\n<em>The ArcGIS API for JavaScript team<\/em><\/p>\n"}],"authors":[{"ID":6561,"user_firstname":"Kristian","user_lastname":"Ekenes","nickname":"Kristian Ekenes","user_nicename":"kekenes","display_name":"Kristian Ekenes","user_email":"KEkenes@esri.com","user_url":"https:\/\/github.com\/ekenes","user_registered":"2018-03-02 00:18:32","user_description":"Kristian Ekenes is a Principal Product Engineer at Esri specializing in data visualization on the web. He works on the ArcGIS Maps SDK for JavaScript, ArcGIS Arcade, and Map Viewer in ArcGIS Online. Kristian's work focuses on researching and developing new and innovative data visualization capabilities of geospatial data in web maps, Arcade integration in web maps, and applications of generative AI assistants in web maps. Prior to joining Esri, he worked as a GIS Specialist for an environmental consulting company. Kristian has degrees from Brigham Young University and Arizona State University.","user_avatar":"<img data-del=\"avatar\" src='https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png' class='avatar pp-user-avatar avatar-96 photo ' height='96' width='96'\/>"}],"related_articles":"","card_image":false,"wide_image":false},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.9 (Yoast SEO v25.9) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>FeatureLayer rendering: taking advantage of WebGL in 2D<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"FeatureLayer rendering: taking advantage of WebGL in 2D\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\" \/>\n<meta property=\"og:site_name\" content=\"ArcGIS Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/esrigis\/\" \/>\n<meta property=\"article:modified_time\" content=\"2019-11-04T22:01:58+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@ESRI\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":[\"Article\",\"BlogPosting\"],\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\"},\"author\":{\"name\":\"Kristian Ekenes\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b\"},\"headline\":\"FeatureLayer rendering: taking advantage of WebGL in 2D\",\"datePublished\":\"2017-09-29T11:10:08+00:00\",\"dateModified\":\"2019-11-04T22:01:58+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\"},\"wordCount\":8,\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"keywords\":[\"JavaScript\",\"jsapi4\",\"Performance\",\"rendering\",\"WebGIS\",\"WebGL\"],\"articleSection\":[\"Mapping\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\",\"name\":\"FeatureLayer rendering: taking advantage of WebGL in 2D\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\"},\"datePublished\":\"2017-09-29T11:10:08+00:00\",\"dateModified\":\"2019-11-04T22:01:58+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.esri.com\/arcgis-blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"FeatureLayer rendering: taking advantage of WebGL in 2D\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/\",\"name\":\"ArcGIS Blog\",\"description\":\"Get insider info from Esri product teams\",\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.esri.com\/arcgis-blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\",\"name\":\"Esri\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png\",\"width\":400,\"height\":400,\"caption\":\"Esri\"},\"image\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/esrigis\/\",\"https:\/\/x.com\/ESRI\",\"https:\/\/www.linkedin.com\/company\/5311\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b\",\"name\":\"Kristian Ekenes\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png\",\"caption\":\"Kristian Ekenes\"},\"description\":\"Kristian Ekenes is a Principal Product Engineer at Esri specializing in data visualization on the web. He works on the ArcGIS Maps SDK for JavaScript, ArcGIS Arcade, and Map Viewer in ArcGIS Online. Kristian's work focuses on researching and developing new and innovative data visualization capabilities of geospatial data in web maps, Arcade integration in web maps, and applications of generative AI assistants in web maps. Prior to joining Esri, he worked as a GIS Specialist for an environmental consulting company. Kristian has degrees from Brigham Young University and Arizona State University.\",\"sameAs\":[\"https:\/\/github.com\/ekenes\",\"https:\/\/www.linkedin.com\/in\/kristian-ekenes\/\",\"https:\/\/x.com\/kekenes\"],\"gender\":\"male\",\"jobTitle\":\"Principal Product Engineer\",\"worksFor\":\"Esri\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"FeatureLayer rendering: taking advantage of WebGL in 2D","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d","og_locale":"en_US","og_type":"article","og_title":"FeatureLayer rendering: taking advantage of WebGL in 2D","og_url":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d","og_site_name":"ArcGIS Blog","article_publisher":"https:\/\/www.facebook.com\/esrigis\/","article_modified_time":"2019-11-04T22:01:58+00:00","twitter_card":"summary_large_image","twitter_site":"@ESRI","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["Article","BlogPosting"],"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d#article","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d"},"author":{"name":"Kristian Ekenes","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b"},"headline":"FeatureLayer rendering: taking advantage of WebGL in 2D","datePublished":"2017-09-29T11:10:08+00:00","dateModified":"2019-11-04T22:01:58+00:00","mainEntityOfPage":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d"},"wordCount":8,"publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"keywords":["JavaScript","jsapi4","Performance","rendering","WebGIS","WebGL"],"articleSection":["Mapping"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d","url":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d","name":"FeatureLayer rendering: taking advantage of WebGL in 2D","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#website"},"datePublished":"2017-09-29T11:10:08+00:00","dateModified":"2019-11-04T22:01:58+00:00","breadcrumb":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/mapping\/mapping\/featurelayer-rendering-taking-advantage-of-webgl-in-2d#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.esri.com\/arcgis-blog\/"},{"@type":"ListItem","position":2,"name":"FeatureLayer rendering: taking advantage of WebGL in 2D"}]},{"@type":"WebSite","@id":"https:\/\/www.esri.com\/arcgis-blog\/#website","url":"https:\/\/www.esri.com\/arcgis-blog\/","name":"ArcGIS Blog","description":"Get insider info from Esri product teams","publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.esri.com\/arcgis-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization","name":"Esri","url":"https:\/\/www.esri.com\/arcgis-blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png","width":400,"height":400,"caption":"Esri"},"image":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/esrigis\/","https:\/\/x.com\/ESRI","https:\/\/www.linkedin.com\/company\/5311\/"]},{"@type":"Person","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b","name":"Kristian Ekenes","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/image\/","url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png","caption":"Kristian Ekenes"},"description":"Kristian Ekenes is a Principal Product Engineer at Esri specializing in data visualization on the web. He works on the ArcGIS Maps SDK for JavaScript, ArcGIS Arcade, and Map Viewer in ArcGIS Online. Kristian's work focuses on researching and developing new and innovative data visualization capabilities of geospatial data in web maps, Arcade integration in web maps, and applications of generative AI assistants in web maps. Prior to joining Esri, he worked as a GIS Specialist for an environmental consulting company. Kristian has degrees from Brigham Young University and Arizona State University.","sameAs":["https:\/\/github.com\/ekenes","https:\/\/www.linkedin.com\/in\/kristian-ekenes\/","https:\/\/x.com\/kekenes"],"gender":"male","jobTitle":"Principal Product Engineer","worksFor":"Esri","url":"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes"}]}},"text_date":"September 29, 2017","author_name":"Kristian Ekenes","author_page":"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes","custom_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2025\/08\/Newsroom-Keyart-Wide-1920-x-1080.jpg","primary_product":"ArcGIS Maps SDK for JavaScript","tag_data":[{"term_id":24921,"name":"JavaScript","slug":"javascript","term_group":0,"term_taxonomy_id":24921,"taxonomy":"post_tag","description":"","parent":0,"count":151,"filter":"raw"},{"term_id":27491,"name":"jsapi4","slug":"jsapi4","term_group":0,"term_taxonomy_id":27491,"taxonomy":"post_tag","description":"","parent":0,"count":111,"filter":"raw"},{"term_id":30321,"name":"Performance","slug":"performance","term_group":0,"term_taxonomy_id":30321,"taxonomy":"post_tag","description":"","parent":0,"count":29,"filter":"raw"},{"term_id":29541,"name":"rendering","slug":"rendering","term_group":0,"term_taxonomy_id":29541,"taxonomy":"post_tag","description":"","parent":0,"count":17,"filter":"raw"},{"term_id":28501,"name":"WebGIS","slug":"webgis","term_group":0,"term_taxonomy_id":28501,"taxonomy":"post_tag","description":"","parent":0,"count":4,"filter":"raw"},{"term_id":34641,"name":"WebGL","slug":"webgl","term_group":0,"term_taxonomy_id":34641,"taxonomy":"post_tag","description":"","parent":0,"count":3,"filter":"raw"}],"category_data":[{"term_id":22941,"name":"Mapping","slug":"mapping","term_group":0,"term_taxonomy_id":22941,"taxonomy":"category","description":"","parent":0,"count":2739,"filter":"raw"}],"product_data":[{"term_id":36831,"name":"ArcGIS Maps SDK for JavaScript","slug":"js-api-arcgis","term_group":0,"term_taxonomy_id":36831,"taxonomy":"product","description":"","parent":36601,"count":365,"filter":"raw"},{"term_id":36601,"name":"Developers","slug":"developers","term_group":0,"term_taxonomy_id":36601,"taxonomy":"product","description":"","parent":0,"count":777,"filter":"raw"}],"primary_product_link":"https:\/\/www.esri.com\/arcgis-blog\/?s=#&products=js-api-arcgis","_links":{"self":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/79681","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog"}],"about":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/types\/blog"}],"author":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/users\/6561"}],"replies":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/comments?post=79681"}],"version-history":[{"count":0,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/79681\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/media?parent=79681"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/categories?post=79681"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/tags?post=79681"},{"taxonomy":"industry","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/industry?post=79681"},{"taxonomy":"product","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/product?post=79681"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}