{"id":21984,"date":"2024-06-26T12:50:07","date_gmt":"2024-06-26T19:50:07","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/?p=21984"},"modified":"2024-06-26T12:50:07","modified_gmt":"2024-06-26T19:50:07","slug":"fluid-framework-2-is-now-production-ready","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/fluid-framework-2-is-now-production-ready\/","title":{"rendered":"Fluid Framework 2 is now production ready"},"content":{"rendered":"<p><span data-contrast=\"auto\">We are excited to announce that Fluid Framework 2 is now generally available and ready for production applications! It is the result of the insights we gained from enabling real-time collaboration in Microsoft and partner applications.<\/span><span data-ccp-props=\"{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:279}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">Since we first introduced Fluid Framework, it has been used extensively both within Microsoft and by external customers to build real-time collaborative experiences. With FF 2, we\u2019re making it even easier, more flexible and intuitive to build real-time collaborative applications.<\/span><span data-ccp-props=\"{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:279}\">\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/aka.ms\/fluid\/build24\/loop\"><strong>Microsoft Loop<\/strong><\/a> \u2013 Microsoft Loop is powered by Fluid Framework and SharePoint Embedded, which is now also available for everyone to use.<\/p>\n<p><div style=\"width: 1920px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-21984-1\" width=\"1920\" height=\"1080\" loop autoplay preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/00-StayInSyncHd_video_en-us-0x1080-6439k.mp4?_=1\" \/><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/00-StayInSyncHd_video_en-us-0x1080-6439k.mp4\">https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/00-StayInSyncHd_video_en-us-0x1080-6439k.mp4<\/a><\/video><\/div><\/p>\n<p><a href=\"https:\/\/aka.ms\/fluid\/build24\/edge\"><strong>Edge Workspaces<\/strong><\/a> &#8211; Workspaces in Microsoft Edge provide an incredible way for users to separate their browsing tasks into dedicated windows. Each workspace has its own set of tabs and favorites, all created and curated by collaborators in real-time with features like live presence powered by Fluid Framework.<\/p>\n<p><div style=\"width: 1920px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-21984-2\" width=\"1920\" height=\"1080\" loop autoplay preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/d318a9684d64461783f4b2e57cdd9e69.mp4?_=2\" \/><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/d318a9684d64461783f4b2e57cdd9e69.mp4\">https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/d318a9684d64461783f4b2e57cdd9e69.mp4<\/a><\/video><\/div><\/p>\n<p><strong><a href=\"https:\/\/aka.ms\/fluid\/build24\/teams\">Teams Live Share<\/a><\/strong> &#8211; Live Share is an SDK that uses Fluid Framework to transform Teams apps into collaborative multi-user experiences without writing any dedicated back-end code.<\/p>\n<p><img decoding=\"async\" class=\"alignnone wp-image-21987\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/screenshots-shows-an-example-of-multiple-users-dra.png\" alt=\"Screenshots shows an example of multiple users drawing on a canvas during a meeting.\" width=\"1080\" height=\"607\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/screenshots-shows-an-example-of-multiple-users-dra.png 1432w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/screenshots-shows-an-example-of-multiple-users-dra-300x169.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/screenshots-shows-an-example-of-multiple-users-dra-1024x576.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/screenshots-shows-an-example-of-multiple-users-dra-768x432.png 768w\" sizes=\"(max-width: 1080px) 100vw, 1080px\" \/><\/p>\n<p>Additionally, our industry partners like <a href=\"https:\/\/aka.ms\/fluid\/partner\/a2mac1\">A2MAC1<\/a>, Autodesk and <a href=\"https:\/\/aka.ms\/fluid\/partner\/hexagon\">Hexagon<\/a> have been building incredible real-time collaboration experiences for their audiences.<\/p>\n<p>FF 2 contains the following major updates:<\/p>\n<ol>\n<li><strong>SharedTree Distributed Data Structure (DDS)<\/strong> \u2013 A new, powerful and flexible DDS designed to keep hierarchical data synchronized between clients.<\/li>\n<li><strong>SharePoint Embedded Support<\/strong> \u2013 A new relay and storage solution that allows you to keep the Fluid collaborative data within SharePoint for a Microsoft 365 tenant.<\/li>\n<li><strong>Fluid DevTools<\/strong> \u2013 A browser extension that helps developers when writing and debugging Fluid applications.<\/li>\n<li><strong>Typed Telemetry and App Insights support<\/strong> \u2013 A flexible package that provides Typed telemetry events that you can funnel to your analytics tool of choice or use the included Azure App Insights connector for data visualization and analysis.<\/li>\n<\/ol>\n<h2>SharedTree Distributed Data Structure (DDS)<\/h2>\n<p>The <a href=\"https:\/\/fluidframework.com\/docs\/data-structures\/tree\/\">new SharedTree<\/a> Distributed Data Structure (DDS) provides an intuitive programming interface for working with data and supports a broad range of data types including primitives, objects, arrays, and maps. In addition to including standard data manipulation operations (add, remove, update, move) for these data types, it also includes features like:<\/p>\n<p><strong>Undo\/Redo<\/strong>\u00a0\u2013 The ability to listen for changes and track revertible objects on your undo\/redo stacks. Revertibles allow you to undo and redo changes even if other changes have been made in remote clients.<\/p>\n<p><strong>Transactions<\/strong> \u2013\u00a0You can group multiple changes such that they are applied atomically, and if they fail, they fail atomically. As a result of grouping changes in a transaction, you also get a single revertible object making it easier to undo and redo.<\/p>\n<p><strong>Events<\/strong> \u2013\u00a0We have updated the Events to make it easier to create granular event listeners for single nodes and better support the undo\/redo feature.<\/p>\n<p><strong>Schema improvements<\/strong>\u00a0\u2013 Schemas are even more powerful now with the added support for recursive types, which allows you to define types that reference nodes of the same type in their subtree.<\/p>\n<p>Find out more about SharedTree and how to use Fluid Framework to build AI-driven collaborative apps with this session video from Microsoft Build 2024:<\/p>\n<p style=\"text-align: center;\"><iframe src=\"\/\/www.youtube.com\/embed\/fjRfTdIYzWg?si=Dhe827O3wRlIcqL4\" width=\"560\" height=\"314\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h2>SharePoint Embedded<\/h2>\n<p>Fluid Framework 2 offers support for a new relay service that is part of <a href=\"https:\/\/aka.ms\/fluid\/spe\">SharePoint Embedded<\/a> and allows developers to keep collaborative data within a Microsoft 365 tenant. Enterprise developers can build collaborative line of business apps while benefiting from all features of Microsoft 365 storage including security and compliance. ISVs can also leverage this option in their collaborative apps, with the data being managed within the end customer\u2019s tenant.<\/p>\n<p style=\"text-align: center;\"><iframe src=\"\/\/www.youtube.com\/embed\/t1ZPKR7iEJI?si=7UZlauHBRiharwh1\" width=\"560\" height=\"314\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h2>Fluid DevTools<\/h2>\n<p>Fluid Developer Tools is a browser extension that improves the developer experience when writing and debugging Fluid applications. As Fluid Framework abstracts away complexities of dealing with real-time collaborative applications, it is crucial that developers have access to the underlying state.<\/p>\n<p><img decoding=\"async\" width=\"1431\" height=\"563\" class=\"wp-image-21988\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/a-screenshot-of-a-computer-description-automatica-12.png\" alt=\"A screenshot of a computer Description automatically generated\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/a-screenshot-of-a-computer-description-automatica-12.png 1431w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/a-screenshot-of-a-computer-description-automatica-12-300x118.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/a-screenshot-of-a-computer-description-automatica-12-1024x403.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/06\/a-screenshot-of-a-computer-description-automatica-12-768x302.png 768w\" sizes=\"(max-width: 1431px) 100vw, 1431px\" \/><\/p>\n<p>Fluid Developer Tools provide the following features:<\/p>\n<ul>\n<li>Container state and data visualization<\/li>\n<li>Ability to modify container state for testing offline and reconnect scenarios<\/li>\n<li>Visibility into audience membership, permissions, and join\/leave logs<\/li>\n<li>Framework event logs<\/li>\n<li>Telemetry graphs to view performance<\/li>\n<\/ul>\n<p>You can learn more about Fluid DevTools <a href=\"https:\/\/aka.ms\/fluid\/devtool\/docs\">here<\/a>. <a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/06\/word-image-14258-2.png\">\n<\/a><\/p>\n<h2>Typed telemetry and app insights<\/h2>\n<p>Before deploying your application at scale, it is critical to have the holistic telemetry in place to monitor its usage and look for issues and optimizations. To make this easier, we are providing a fluid-telemetry package that comes with Typed telemetry events that you can funnel to your any analytics tool of your choice. If you decide to use\u00a0Azure App Insights\u00a0to view this data, we also provide helper packages and dashboard queries to get you started quickly.\u00a0<a href=\"https:\/\/aka.ms\/fluid\/telemetry\" target=\"_blank\" rel=\"noopener\">Learn more about the telemetry packages here.<\/a><\/p>\n<h2>Start building today<\/h2>\n<p>Fluid Framework 2 is now ready to power your production app experiences. We\u2019re looking forward to seeing what you build with it!<\/p>\n<p>Visit the following resources to learn more:<\/p>\n<ul>\n<li><a href=\"https:\/\/aka.ms\/fluid\/start\" target=\"_blank\" rel=\"noopener\">Get Started<\/a>\u00a0with Fluid Framework 2<\/li>\n<li><a href=\"https:\/\/aka.ms\/fluid\/samples\" target=\"_blank\" rel=\"noopener\">Sample app code<\/a>\u00a0using SharedTree DDS and SharePoint Embedded<\/li>\n<li>For questions or feedback,\u00a0<a href=\"https:\/\/aka.ms\/fluid\/discuss\" target=\"_blank\" rel=\"noopener\">reach out via Github<\/a><\/li>\n<li><a href=\"https:\/\/aka.ms\/fluid\/connect\" target=\"_blank\" rel=\"noopener\">Connect directly with the Fluid team<\/a>, we would love to hear what you are building!<\/li>\n<li>Follow\u00a0<a href=\"http:\/\/twitter.com\/fluidframework\" target=\"_blank\" rel=\"noopener\">@FluidFramework on X (Twitter)<\/a>\u00a0to stay updated<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>We are excited to announce that Fluid Framework 2 is now generally available and ready for production applications.<\/p>\n","protected":false},"author":121366,"featured_media":21986,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[6],"tags":[339,118,338,302],"class_list":["post-21984","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-fluid-framework","tag-fluid-dev-tools","tag-fluid-framework","tag-fluid-framework-2","tag-sharedtree"],"acf":[],"blog_post_summary":"<p>We are excited to announce that Fluid Framework 2 is now generally available and ready for production applications.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/21984","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/users\/121366"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/comments?post=21984"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/21984\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media\/21986"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media?parent=21984"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/categories?post=21984"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/tags?post=21984"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}