-
Notifications
You must be signed in to change notification settings - Fork 4.6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
18 changed files
with
4,545 additions
and
7,693 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,96 +1,184 @@ | ||
| import ZoomableImage from "/src/theme/ZoomableImage.js"; | ||
|
|
||
| # A new chapter for Langflow | ||
|
|
||
| # First things first | ||
| ## First things first | ||
|
|
||
| **Thank you all for being part of the Langflow community**. The journey so far has been amazing and we are happy to have you with us. | ||
| **Thank you all for being part of the Langflow community**. The journey so far has been amazing, and we are thrilled to have you with us. | ||
|
|
||
| We have some exciting news to share with you. Langflow is changing, and we want to tell you all about it. | ||
| We have some exciting news to share with you. Langflow is evolving, and we want to tell you all about it! | ||
|
|
||
| ## Where have we been? | ||
| ## What's new? | ||
|
|
||
| We spent the last few months working on a new version of Langflow. We wanted to make it more powerful, more flexible, and easier to use. | ||
| We're moving from version 0.6 straight to 1.0 (preview). This is a big change, and we want to explain why we're doing it and what it means for you. | ||
| In the past year, we learned a lot from the community and our users. We saw the potential of Langflow and the need for a visual, interactive platform for building conversational AI applications (and beyond). You thought us the importance of a platform that is easy to use, but also powerful and controllable, and that made clear to us how Langflow's transparency could be improved. | ||
|
|
||
| ## Why? | ||
| Below are some of the new features we included to make that happen! | ||
|
|
||
| In the past year, we learned a lot from the community and our users. We saw the potential of Langflow and the need for a more powerful and flexible tool for building conversational AI applications (and beyond). | ||
| We realized that Langflow was hiding things from you that would really help you build better and more complex conversational AI applications. So we decided to make a big change. | ||
| ### Same Component, Multiple Outputs | ||
|
|
||
| ## The only way to go is forward | ||
| Components can now have more than a single output, allowing for unique flexibility in creating complex flows. The game-changer is output routing — it allows for so many new capabilities it’s almost silly to describe! | ||
|
|
||
| From all the people we talked to, we learned that the most important thing for (most of) them is to have a tool that is easy to use, but also powerful and controllable. They also told us that Langflow's transparency could be improved. | ||
| 1. Branch to one or more subsequent components; | ||
| 2. Apply logic operations like if/else and exploit decision-making; | ||
| 3. Create classification models that choose between paths; | ||
| 4. Enable the development of agent architectures from scratch; | ||
| 5. Build an orchestrator that routes between agents. | ||
|
|
||
| In those points, we saw an opportunity to make Langflow much more powerful and flexible, while also making it easier to use and understand. | ||
| <ZoomableImage | ||
| alt="Multiple Outputs" | ||
| sources={{ | ||
| light: "/img/multiple_outputs.webp", | ||
| dark: "/img/multiple_outputs.webp", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| One key change you'll notice is that projects now require you to define Inputs and Outputs. | ||
| This is a big change, but it's also a big improvement. | ||
| It allows you to define the structure of your conversation and the data that flows through it. | ||
| This makes it easier to understand and control your conversation. | ||
| ### Flow + Composition | ||
|
|
||
| This change comes with a new way of visualizing your projects. Before 1.0 you would connect Components to ultimately build one final Component that was processed behind the scenes. | ||
| Now, each step of the process is defined by you, is visible on the workspace, and can be monitored and controlled by you. This makes it so that Composition is now just another way of building in Langflow. **Now data flows through your project more transparently**. | ||
| One key change you'll notice is that projects now require you to define **Inputs** and **Outputs**. They allow you to define the structure of your conversation and how data flows through it. This change comes with a new way of visualizing your projects. | ||
|
|
||
| The caveat is existing projects may need some new Components to get them back to their full functionality. | ||
| [We've made this as easy as possible](../migration/compatibility), and there will be improvements to it as we get feedback in our Discord server and on GitHub. | ||
| Before 1.0 you would connect components to ultimately build one final component that was processed behind the scenes. Now, each step of the process is defined by you, is visible on the workspace, and can be monitored and controlled. | ||
|
|
||
| ## Custom Interactions | ||
| This makes it so that composition is now just **another way** of building in Langflow and **data flows through your project more transparently**. This means that the easy stuff is *really* easy and the complex parts are still possible! | ||
|
|
||
| The moment we decided to make this change, we saw the potential to make Langflow even more yours. | ||
| By having a clear definition of Inputs and Outputs, we could build the experience around that which led us to create the **Playground**. | ||
| - **Flow:** Data is processed by one component and then passed to the next component in line for immediate execution. | ||
| - **Composition**: Allows components to not only forward data but also share states for modular building. | ||
|
|
||
| When building a project testing and debugging is crucial. The Playground is a tool that changes dynamically based on the Inputs and Outputs you defined in your project. | ||
| For example, a flow can sequentially process text, and after a few steps, trigger an agent. It can access functions that wait to be called or to respond. This blend of flow and composition brings an unprecedented level of flexibility and control to data workflows in LLM-based apps and agents that use multiple models and APIs working together to achieve tasks. | ||
|
|
||
| For example, let's say you are building a simple RAG application. Generally, you have an Input, some references that come from a Vector Store Search, a Prompt and the answer. | ||
| Now, you could plug the output of your Prompt into a [Text Output](../components/inputs-and-outputs), rename that to "Prompt Result" and see the output of your Prompt in the Playground. | ||
| <ZoomableImage | ||
| alt="Flow + Composition" | ||
| sources={{ | ||
| light: "/img/flow-composition.webp", | ||
| dark: "/img/flow-composition.webp", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| {/* Add image here of the described above */} | ||
| ### Memory Management | ||
|
|
||
| This is just one example of how the Playground can help you build and debug your projects. | ||
| Langflow 1.0 natively allows every chat message to be stored, and a single flow can have multiple memory sessions. This enables you to create multiple “memories” for agents to store and recall specific information as needed. | ||
|
|
||
| We have many planned features for the Playground, and we're excited to see how you use it and what you think of it. | ||
| You can edit and remove previous messages to inspect and validate a model’s response behavior. Control, explore, and manage conversation histories to get your models acting just right. | ||
|
|
||
| ## An easier start | ||
| <ZoomableImage | ||
| alt="Playground" | ||
| sources={{ | ||
| light: "/img/playground.png", | ||
| dark: "/img/playground.png", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| The experience for the first-time user is also something we wanted to improve. | ||
| ### Component Freeze 🥶 | ||
|
|
||
| Meet the new and improved **New Project** screen. It's now easier to start a new project, and you can choose from a list of starter projects to get you started. | ||
| Component output freezing is back in Langflow, and it’s cooler than ever! | ||
|
|
||
| {/* Add new project image */} | ||
| Once a component runs, you can now lock its previous output state to prevent it from re-running. | ||
|
|
||
| We wanted to create start projects that would help you learn about new features and also give you a head start on your projects. | ||
| Avoid spending extra tokens and remove repetition when output should be constant — plus it's great for debugging and prototyping! | ||
|
|
||
| For now, we have: | ||
| <ZoomableImage | ||
| alt="Component Freeze" | ||
| sources={{ | ||
| light: "/img/component-freeze.jpeg", | ||
| dark: "/img/component-freeze.jpeg", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| ### Output Preview | ||
|
|
||
| Each component now includes an output visualizer that opens a pop-up screen, allowing you to easily inspect and monitor transmissions between components. It provides instant feedback on your workflows, letting you see results as they are processed. 🔍 | ||
|
|
||
| <ZoomableImage | ||
| alt="Output Preview" | ||
| sources={{ | ||
| light: "/img/output-preview.gif", | ||
| dark: "/img/output-preview.gif", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| ### Inputs and Outputs Handling | ||
|
|
||
| Inputs and outputs finally make more sense to us, and hopefully to you too. | ||
|
|
||
| We’re proposing Langflow-native types to keep things consistent, but not limited to use any Python type. For instance, a Chat Input component sends out what we call a Message object (text + metadata like date, time, and sender), but maybe you want to introduce external types from your favorite Python package? Go wild. Each native type will have their own visualization modes and will evolve according to new integrations added. | ||
|
|
||
| ### Custom Endpoint Name | ||
|
|
||
| Now you can pick a custom name for your endpoint used to call your flow from the API. | ||
|
|
||
| <ZoomableImage | ||
| alt="Custom Endpoint Name" | ||
| sources={{ | ||
| light: "/img/custom-endpoint.webp", | ||
| dark: "/img/custom-endpoint.webp", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| - **[Basic Prompting (Hello, World)](/starter-projects/basic-prompting)**: A simple flow that shows you how to use the Prompt Component and how to talk like a pirate. | ||
| - **[Vector Store RAG](/tutorials/rag-with-astradb)**: A flow that shows you how to ingest data into a Vector Store and then use it to run a RAG application. | ||
| - **[Memory Chatbot](/starter-projects/memory-chatbot)**: This one shows you how to create a simple chatbot that can remember things about the user. | ||
| - **[Document QA](/starter-projects/document-qa)**: This flow shows you how to build a simple flow that helps you get answers about a document. | ||
| - **[Blog Writer](/starter-projects/blog-writer)**: Shows you how you can expand on the Prompt variables and be creative about what inputs you add to it. | ||
| ### Logs & Monitoring | ||
|
|
||
| As always, your feedback is invaluable, so please let us know what you think of the new starter projects and what you would like to see in the future. | ||
| A new logs page has been added! Now, both component executions and message history from the chat can be inspected in an interactive table. This will make it easier to debug, inspect, and manage messages passing through components. | ||
|
|
||
| ## Less is more | ||
| <ZoomableImage | ||
| alt="Logs and Monitoring" | ||
| sources={{ | ||
| light: "img/logs-monitoring.webp", | ||
| dark: "img/logs-monitoring.webp", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| We added many new Components to Langflow and updated some of the existing ones, and we will deprecate some of them. | ||
| ### Folders 📁 | ||
|
|
||
| The idea is that Langflow has evolved, and we want to make sure that the Components you use are the best they can be. | ||
| Some of them don't work well with the others, and some of them are just not needed anymore. | ||
| We introduced folders on the home page to help categorize flows and components. Create, remove and edit them to keep your work organized. | ||
|
|
||
| ### Playground | ||
|
|
||
| By having a clear definition of Inputs and Outputs, we could build the experience around that, which led us to create the Playground. When building a project, testing and debugging are crucial. The Playground is an interface that changes dynamically based on the Inputs and Outputs you defined in your project. | ||
|
|
||
| For example, let's say you are building a simple RAG application. Generally, you have an Input, some references that come from a Vector Store Search, a Prompt, and the answer. Now, you could plug the output of your Prompt into a Text Output, rename that to "Prompt Result," and see the output of your Prompt in the Playground. We have many planned features for the Playground, and we're excited to see how you'll explore it! | ||
|
|
||
| ### Multi-Modal | ||
|
|
||
| Langflow is now multi-modal! It can now handle images and more soon! | ||
|
|
||
| <ZoomableImage | ||
| alt="Multi Modal" | ||
| sources={{ | ||
| light: "/img/multi-modal.png", | ||
| dark: "/img/multi-modal.png", | ||
| }} | ||
| style={{ width: "80%", margin: "20px auto" }} | ||
| /> | ||
|
|
||
| We’ve also improved project organization, global variables and overall settings, added Python 3.12 compatibility, keyboard shortcuts and a lot of new and fun experimental components! | ||
|
|
||
| ## An Easier Start | ||
|
|
||
| The experience for first-time users is something we wanted to improve. For that we created a couple of Starter Projects. It's now much easier to start a new project, and you can choose from a list of starter projects to get you going. | ||
|
|
||
| For now, we have: | ||
|
|
||
| We are working on a list of Components that will be deprecated. | ||
| In the preview stages of 1.0, we will have a smaller list of Components so that we make sure that the ones we have are the best they can be. | ||
| Regardless, community feedback is very important in this matter, so please let us know what you think of the new Components and which ones you miss. | ||
| - **Basic Prompting (Hello, World)**: Learn the basics of a Prompt Component. | ||
| - **Vector Store RAG**: Ingest data into a Vector Store and then use it to run a RAG application. | ||
| - **Memory Chatbot**: Create a simple chatbot that can remember things about the user. | ||
| - **Document QA**: Build a simple flow that helps you get answers about a document. | ||
| - **Blog Writer**: Expand on the Prompt variables and be creative about what inputs you add to it. | ||
|
|
||
| We are aiming at having a more stable and reliable set of Components that helps you get quickly to useful results. | ||
| This also means that your contributions in the [Langflow Store](https://langflow.store) and throughout the community are more important than ever. | ||
| Please let us know what other starter projects you would like to see in the future! | ||
|
|
||
| ## What's next? | ||
| --- | ||
|
|
||
| Langflow went through a big change, and we are excited to see how you use it and what you think of it. | ||
| ## What's Next? | ||
|
|
||
| We plan to add more types of Input and Output like Image and Audio, and we also plan to add more Components to help you build more complex projects. | ||
| Langflow has gone through a big change, and we are excited to see how you use it and what you think of it. We plan to add more types of Input and Output like Image and Audio, and we also plan to add more Components to help you build more complex projects. | ||
|
|
||
| We also have some experimental features like a State Management System (so cool!) and a new way of building Grouped Components that we are excited to show you. | ||
| We are excited to see the community embracing Langflow as their number one AI builder and eagerly wait to see what new inspiring projects will come out of this release! A big thanks to everyone who's supporting or being part of this community in any way. ✨ | ||
|
|
||
| ## Reach out | ||
| Sincerely, | ||
|
|
||
| One last time, we want to thank you for being part of the Langflow community. Your feedback is invaluable, and we want to hear from you. | ||
| **The Langflow Team 🚀** |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.